Quote:
Originally Posted by ElMiko
Thanks, guys.
couple of clarifying questions:
@Turtle91: When I first reproduced the code, this is what I got:
Attachment 217705
With a little poking, I figured out that it was the container width that was causing the 2nd line to break, which i changed to 60%. However, no matter how you slice it, the text isn't actually automatically centering in the page. So for example, if i expand the window (keeping your original 50vw) you'll see:
Attachment 217706
Is having to set the viewport width relative to the physical width of the viewing window just an unavoidable feature of this solution, or is there a way to make it automatically center for any length of text?
|
Setting the width of the containing div allows the margin:xx auto to evenly divide what is left into the left/right margin. The main issue is that you have the inner div left-aligned... which means that the larger the width of your window, the more space you will get on the right side.
Try adding a border (border:1px solid red; or green) to each of the divs as you play with the widths to help visualize what it is doing.
Your other option is to use a flex box (if ePub3), or a table (ugh), or just center each of the parts...it doesn't have to be exactly like the print version.