Canvas Support

Same height of div block

6 replies · opened Nov 9, 2020

GgizbooNov 9, 2020

hi,

It's possible to have the same height for all blocks ?

Thanks

SSemicolon WebSTAFFNov 9, 2020

Hello,

If you are using the .row Class on the Container of the Blocks, simply add the .align-items-stretch Class to the Container. Else, you can use the .d-flex Class on the Container and then add the .align-items-stretch Class to the Container.

This should definitely work fine. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

GgizbooNov 9, 2020

hi,

Sorry, but i can't do it. I don't see exactly where to position the classes.

Regards

SSemicolon WebSTAFFNov 9, 2020

Hello,

The Class should be added to the .row DIV. Example:
[ch_pre][/ch_pre]

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

GgizbooNov 9, 2020

I tried but it doesn't change anything, sorry, do you have another idea?

SSemicolon WebSTAFFNov 10, 2020

Hello,

The Same Height functionality for this would work fine and if you check the .col-md-1-5 DIVs using the Inspect Element, you will see that they all have the same heights. However, since you are using the .card Element inside this which has a Border, this makes it look like the Height is not working as the .card Element has flexible heights according to their contents.

To fix this, you will need to either apply the .card to the main .col-md-1-5 DIVs or consider using the following code:
[ch_pre]

		Lorem ipsum dolor sit amet consectetur adipisicing elit. Deserunt alias ipsum labore nesciunt, earum hic, officiis repudiandae inventore sequi fugit.
	


	
		Lorem ipsum dolor sit amet consectetur adipisicing elit. Sint rerum hic fugit inventore, deserunt fugiat at laudantium, nam magnam ea quo velit quisquam maiores sapiente molestias quas. Autem quam, laboriosam?
	


	
		Lorem ipsum dolor sit, amet, consectetur adipisicing elit. Dignissimos, quasi.
	


	
		Lorem ipsum dolor sit amet consectetur adipisicing elit. Velit esse sit, est. Mollitia, eius dolor eos odit soluta numquam. Minima vero eum quis molestias tempora, dignissimos accusantium qui voluptatem quidem provident vitae omnis, cum consequuntur, quod, laudantium laboriosam consectetur eaque.
	


	
		Lorem ipsum dolor sit amet consectetur adipisicing elit. Corrupti, officia!
	


	
		Lorem, ipsum dolor sit amet consectetur adipisicing elit. Distinctio ipsum at perspiciatis pariatur nisi atque eaque, dicta aut, eveniet magni iste harum alias officiis omnis tempora dolores odio esse! Adipisci.
	


	
		Lorem, ipsum dolor sit amet consectetur adipisicing elit. Necessitatibus modi, nesciunt, aperiam est quisquam, labore quaerat praesentium iste corporis aut hic voluptate distinctio voluptatum.
	


	
		Lorem, ipsum dolor sit amet consectetur adipisicing elit. Beatae, tempora.
	


	
		Lorem ipsum dolor sit amet, consectetur adipisicing elit. Temporibus impedit eius reprehenderit delectus autem dolorem!
	


	
		Lorem ipsum dolor sit amet consectetur, adipisicing elit. Tenetur, officia? Sapiente corrupti fugit perspiciatis, quam odio esse odit totam ab nostrum, velit accusantium accusamus assumenda illo, quidem id aspernatur voluptate? Iure, eligendi magnam cum? Voluptate.

[/ch_pre]

This should definitely work fine. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

GgizbooNov 10, 2020

hi,

it works, thank you very much.

Regards

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard