Utilizing large screen estate with the help of CSS multiple columns layout allow us to increase the eye comfort of the reader by splitting longer lines of text into easier-to-read shorter lines.
The other option would be using shorter lines and not utilizing the screen fully, which might come into play in mobile devices with screens small enough to fit exactly one short column on them.
Below is a div splitting text into 2 columns on screens larger than 768px (usually desktop or laptop screens), melding back into a single-column layout on smaller (mobile) screens.
The text is justified left in this case because I like it more that way in this kind of layout. I also used a column divider called column-rule in CSS to embelish the column visual a little.
Temporibus officiis sit quo id. Excepturi eum sed sint quo aperiam accusantium quam nemo. Quibusdam non quo sed sunt nihil dolore aliquid quos.
Quos et ducimus distinctio similique laudantium sed. Enim nobis quasi sit sapiente qui nihil. Dolore quibusdam rem libero facilis veritatis aut animi quidem. Officia hic sunt quis et sed laudantium.
Et id deserunt corrupti. Voluptatem nihil at voluptatem et tempore exercitationem. Doloremque maiores dicta atque. Expedita laborum quia placeat.
#divmultiplecolumns {
text-align: left;
border: 2px dashed whitesmoke;
border-bottom-style: none;
border-right-style: none;
min-height: 100px;
margin: 1em 3em 2em;
padding: 1em 0 1em;
-webkit-column-count: 2;
-moz-column-count: 2;
column-count: 2;
-webkit-column-width: 100px;
-moz-column-width: 100px;
column-width: 100px;
-webkit-column-gap: .1em;
-moz-column-gap: .1em;
column-gap: .1em;
-webkit-column-rule: .1em dashed gainsboro;
-moz-column-rule: .1em dashed gainsboro;
column-rule: 1px dashed gainsboro;
}
#divmultiplecolumns p {
text-align: left;
}
@media screen and (max-width: 768px){
#divmultiplecolumns{
-webkit-column-count: 1;
-moz-column-count: 1;
column-count: 1;
}