The two or more different div of same height can be put side-by-side using CSS. Use CSS property to set the height and width of div and use display property to place div in side-by-side format.
The used display property are listed below:
- display:table; This property is used for elements (div) which behaves like table.
- display:table-cell; This property is used for elements (div) which behaves like td.
- display:table-row: This property is used for elements (div) which behaves like tr.
Example 2: This example contains multiple number of div put into side-by-side using CSS.
- HTML width/height Attribute vs CSS width/height Property
- CSS place-self Property
- How to place a div inside an iframe for IE ?
- Place K-knights such that they do not attack each other
- How to place two bootstrap cards next to each other ?
- CSS place-content Property
- How to place text on image using HTML and CSS?
- How to place button in top Right corner using bootstrap?
- How to force tab-navigation to stay in place using Bootstrap ?
- How to place text in an image at any desired position ?
- Ways to place K bishops on an N×N chessboard so that no two attack
- How place a checkbox into the center of a table cell?
- How to place content under fixed flexbox navigation bar ?
- How to place table text into center using Bootstrap?
- How to place the image above the slider in mobile view in bootstrap?
- How to place Font Awesome icon to input field ?
- CSS | Height and Width
- CSS | min-height Property
- CSS | max-height Property
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to email@example.com. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.