Skip to main content

How do I create equal height columns?

Learn how to create equal height columns with CSS.

 

Read on how to do it in this tutorial: https://www.w3schools.com/howto/howto_css_equal_height.asp 

 

How To Create Equal Height Columns

When you have columns that should appear side by side, you'll often want them to be of equal height (matching the height of the tallest).

Screenshot_2021-11-06_at_09.23.53.png

 

Try it yourself here: https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_equal_height 

 

Note: Flexbox is not supported in Internet Explorer 10 and earlier versions.

Tip: Read more about flexible boxes in our CSS Flexbox Tutorial.