I’ve long used Tables to do my vertical centering. But now that FW7 is out and CSS layout (responsive layout) is all the rage, I am thinking about centering via CSS (inline layout). But I can’t figure out how to do it, hence my post in this thread.
Watch this brief screencast (no sound, showing Freeway 7):
Note that I’ve got one big HTML container box (height is left undefined so it can vertically expand or contract), and inside that container box are 3 pieces of content (pasted HTML boxes, all Floated Left):
- Graphic pass-thru at left which I made a child of an HTML box. It’s parent HTML box was pasted as an inline, then Floated Left.
- HTML box with text content in the middle, pasted as an inline, then Floated Left.
- HTML box with text content at right, pasted as an inline, then Floated Left.
Clearly, the box at right will always be vertically taller that the 2 items, so I don’t care about vertically centering it. But the two HTML boxes at left to be vertically centered, regardless of how the text in the browser shrinks or expands. And as you can see at the end of my video, vertical centering of that content won’t happen if I merely “fake” centering by way of adding a fixed Margin to the top of the HTML box I am trying to center.
How do I use Freeway to vertically center that content without using Margin or Padding to “fake” it? (Note that I am using Freeway 7 now, which should have all the power I need to accomplish this feat.)
freewaytalk mailing list
Update your subscriptions at: