How to align different widget sizes | Communifire Support

Are there any CSS tricks to force two widgets to always be the same height (see below)? Simply assigning the same height to the two widgets does not seem to work for different window sizes.

Hi Maxwell,

The best way to align these elements would be using FlexBox. You will need to create a parent container, a flexbox container, and the then the children become flex items. Since there are multiple widgets with nested elements, you may need to utilize multiple flex containers. These will also impact responsiveness, so you will need to use media queries to change the flex properties at different screen widths. 

There are a few very good articles on how best to utilize this CSS element, and guides to use it the best way possible. 

• One is A Complete Guide to Flexbox.
• Another is located here, The Ultimate CSS Flex Cheatsheet
• Finally, there is an interactive demo that allows you to click different properties to see how they effect the elements here. 

I hope this information helps you customize your Intranet in the best way possible!

Thanks,
Foster

Thanks, Foster!