Miva Merchant Development by Scot's Scripts

CSS: Width of Text Display Using CSS Character Max Width

Miva Knowledge Base
CSS: Width of Text Display Using CSS Character Max Width

WARNING:

This information is offered "AS IS" for internal reference only. Use at your own risk.
Does AI actually understand your Miva Merchant store? Our smart JSON-LD schema generator makes sure it does. Contact us to get started. (more info)

CSS: Width of Text Display Using CSS Character Max Width

Scot Ranney • June 01, 2026

THIS CODE IS PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED;
THE AUTHOR DISCLAIMS ALL LIABILITY FOR ANY DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR STORE DISRUPTIONS ARISING FROM ITS USE.

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.

https://www.scotsscripts.com/mvblog/css-width-of-text-display-using-css-character-max-width.html

mvkb_css