In this post we will learn how to display div as columns by using CSS below are the details.
- Create two <div>
- Add class name as “column“
- Add below mentioned css to “column” class
- Here float and width properties are required to display <div> as column on the page.
.column {
float: left;
width: 50%;
padding: 10px;
height: 200px;
}
- Also float needs to be cleared after the column <div> so the css will not be applied to non-column elements and clear property is required for same.
- Add below mentioned .clear class to non-column elements.
.clear{
clear: both;
}