> How does the aligning of the floats work?
Floats go as high as they can, but not higher - unless you pull them up.
So, floats always align vertically with their top edge or margin in line
with whatever element they line up against.
With 2 floats side by side, their top edges/margins should be at the
same vertical line.
Text-alignment in any one of those floats has no relations to text in
the other float or other elements, and will only be affected by whatever
font-size, line-height etc that's declared on itself and its own float.
No problem getting whatever text line-up you want - static or
dynamically, but it won't work well as long as you apply absolute units
for font-size, line-height and vertical paddings and/or margins.
Reliable vertical alignment of a float based on the size of its
text-content - a kind of baseline alignment, requires well-calculated
use of relative units.
I use such vertical alignment for the floating section-headlines
throughout my entire site, aligning the headline-text with the top edge
of the container the floating headline is pulled up from. Works
regardless of font-resizing and other variables, and is only disturbed
slightly by differences in how browsers map relative units to actual
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/