Quote:
Originally Posted by ElMiko
I tried moving the inline-block property from the blockquote element to the p elements within it themselves, which does solve the issue of the blockquote element not reflowing, but creates a bunch of new issues:
1) for some reason the bottom margin of the blockquote isn't rendered (i.e. the blockquote lies on top of the <p> element with no margin) (NOTE: the attached image is NOT showing this behavior. It is attached to show the desired effect as described in the following bullet).
2) it prevents aligning items realtive to the width of the blockquote container. So, for example if I want an attribution line ("<p>Written by<br />A very clever guy</p>") that is left-aligned relative to itself, but the element is right-aligned relative to the broader blockquote AND bounded by the preceding poem rather than the page width (see image1 attached)... well, it doesn't work because the inline-block has been applied to the stanzas individually rather than the blockquote.
So, unfortunately, I don't think inline-blocking the stanzas is the solution, either... |
You cannot do this. It's not possible. You don't know the screen. You don't know the font size. You don't know the line height. You don't know the font. You cannot assume it fits on one screen so you can do what you want.
If you have it centered, what do you do if any of the lines don't fit in full? The way I did it when they wrap, you know it and it looks OK. If you have it centered, it will not look good when any of the lines wrap.
You also have to have text wrap to the next screen when it doesn't fully fit on one screen. There is no other way to do it.
So basically, what you want is unrealistic.