What is the use of column layout in CSS?
What is the use of column layout in CSS?
Reading very long lines of text can be problematic for some people. They will have to focus more on not missing a line instead of the text itself. This problem is easily solved by using multiple columns to lay out the content. Multiple columns are Present in print media. The CSS Multi-column Layout Module features enable us to recreate the same kind of multi-column effect on websites. The CSS multi-column layout extends the block layout mode to allow the easy definition of multiple columns of text.
div {
column-rule-style: solid;
}
div tag can be used.. Moreover there are multiple use of column layout in CSS
It is up to you if you want to use floats or flex to create a two-column layout.
Add HTML
<div class="row">
<div class="column"></div>
<div class="column"></div>
</div>
Add CSS
.column {
float: left;
width: 50%;
}
/* Clear floats after the columns */
.row:after {
content: "";
display: table;
clear: both;
}
Bookmarks