I’m looking for similar solution as well.
I want to limit page / post width to 60em since the optimum readability length is 50 to 60 characters.
Sure, set the container to a width of whatever you require.
50 to 60 characters is fine as a base average, but be aware the user or browser should be able to scale up the text size + down as they require which pushes your character count out of the window. Nothing wrong with using your average character count as a base, just design with accesibility in mind. This is also assuming you don’t want your theme to be responsive.
Wouldn’t using “em” make page/post width scale with text size?
I already tried placing in custom css:
div.entry-content {max-width: 60em;}
Nothing happened.
Ah. It’s div#content.span9.article-container that controls post and page width.
Max-width attribute doesn’t seem to work with it. And it won’t accept measurements in em.
OK. I think I got it. I added the following to custom css.
#content {
max-width: 30em;
}
See: http://www.crownegardenhotel.com/
Now, I need to figure out how to center…
div.container {
max-width: 54em;
margin-right: auto;
margin-left: auto;
}
#content {
max-width: 34em;
}
I think this is it. I have tested it in Google Chrome, Firefox, Safari, IE (all latest versions).
div.container – to center it
#content – to keep page/post at more or less optimal reading length.
50em and 30em would have been better but I had a page title that was too long which made the comment bubble overlap.
