Bootstrap create column height same By default column height is not same so we need to add our own css class to make column height same as other. Here in this article we are going to add our own css to make all columns height same. You can use our online editor to edit and run the code online.
Bootstrap create column height same Example
You can create custom class to make all columns height same. Here is an exmaple-
Bootstrap create column height same Example:
<title>Bootstrap Tutorial</title>
<!-- Latest compiled and minified CSS -->
<!-- Latest compiled and minified JavaScript -->
<div class="container">
<div class="row eq-column-height">
<div class="col-xs-12 col-sm-4 panel amp-wp-inline-1d59257bad50bcf5af253a9522baaf19">
Column 1
</div>
<div class="col-xs-6 col-sm-4 panel amp-wp-inline-7ed89eb35ccd42a40f9a1e4af2e4bdbb">
<div class="amp-wp-inline-efce3fef0afe530871890e9e27977787">Column 2</div>
</div>
<div class="col-xs-6 col-sm-4 panel amp-wp-inline-972e44cc1ad461def5840449f7f4d274">
Column 3
</div>
</div>
</div>
|
As you can see we have made middle column height 200px now other columns will have the same height.
If you run the above example it will produce output something like this-