Scot Ranney • June 01, 2026
Set a block of text to max width based on how many characters in the line. A paperback book has about 70 characters per line. We can emulate that quite easily when displaying tons of text and wondering why it looks bad because the display is so wide.
All we need to do is something like this:
<div style="max-width: 70ch; margin: auto;"> .... a bunch of text </div>
That's it. We'll get a better version of bootstrap's <div class="col-sm-4 offset-sm-4">...</div> which will do a similar thing but constrains it via the grid whereas max-width: 70ch constrains the width via character count.
<div class="col-sm-4 offset-sm-4">...</div>
max-width: 70ch
mvkb_css