On responsive pages, when a text block is wider than about 800px, it becomes difficult for the eye to jump from the end of one line to the begining of another.
The CSS column layout can divide larger blocks of text into newspaper style columns to make readign a lot easier.
Column Properties
The properties used in this setup are column-count which decides the number of columns, column gap which defines the spacing of the columns and the column-rule which inserts the vertical separator.
Break Points
The layout can be changed for different devices by setting different values for the column-count property in media queries.
In this example, the column count is 2 at wider browser/screen widths and is reduced to one for tablets in portrait mode where the line length is reduced enough to easily follow the text. The container height can be increased at each break point to accommodate the text as the available width is reduced.