View Single Post
Old Yesterday, 08:26 PM   #43
ElMiko
Fanatic
ElMiko has read every ebook posted at MobileReadElMiko has read every ebook posted at MobileReadElMiko has read every ebook posted at MobileReadElMiko has read every ebook posted at MobileReadElMiko has read every ebook posted at MobileReadElMiko has read every ebook posted at MobileReadElMiko has read every ebook posted at MobileReadElMiko has read every ebook posted at MobileReadElMiko has read every ebook posted at MobileReadElMiko has read every ebook posted at MobileReadElMiko has read every ebook posted at MobileRead
 
ElMiko's Avatar
 
Posts: 537
Karma: 65460
Join Date: Jun 2011
Device: Kindle Voyage, Boox Go 7
Quote:
Originally Posted by RbnJrg View Post
You want a center block with text aligned to left. If you, instead of "width: fit-content" and "max-width: 85%" (or whatever) employ L/R padding, if your stanzas are short, then all of them won't be centered, you'll have a lot of blank space on the right side. With my code, the width is automatic (fit-content) and the block will be centered acording to the longest stanza.
hmmm... I think maybe either I wasn't clear or I'm just not understanding your explanation.

what i'm referring to is my code that blends your css and Horus like this:

Code:
div.bqib {
    margin: 1em auto;
    padding: 0 2em;
    display: block;
    width: fit-content; 
	}
In otherwords, the only difference is that instead of using max-width to create L/R boundaries, I'm using padding.

I've attached two images below. One uses your max-width + fit-content approach, and the other uses your fit-content + Horus01's padding. In all other respects they are the same.

For blocks where all the lines are short, it appears to center everything exactly the same in both cases... It's just the the "borders" of the block are basically being defined in your code from the inside-out and in the other case from the outside-in.
Attached Thumbnails
Click image for larger version

Name:	imageRJmaxwidth.jpg
Views:	3
Size:	297.4 KB
ID:	221820   Click image for larger version

Name:	imageEMpad.jpg
Views:	3
Size:	295.2 KB
ID:	221821  
ElMiko is offline   Reply With Quote