On Nov 4, 2006, at 8:22 PM, Rob O'Rourke wrote:
and then CSS like:
#container { width: 830px; } /* to leave a 30px gap in the middle
e.g. |400px| 30px |400px| */
.left, .right { height: 60em; width: 400px; margin-bottom: 30px; } /
* whatever your dimensions need to be */
.left { float: left; clear: left; }
.right { float: right; clear: right; }
That way your blocks have equal height and width, will stack as per
the image and you have a nice semantic unique id on each to apply
styles with. Might need some tweaking for cross-browser goodness
but in a fixed width layout that code should be safe to work from.
Rob, I am playing with your suggestion this moment. Setting height in
EM seemed a very good approach, even for rows that have different
lenght of contents. When I tried enlarge the font size in Firefox and
Safari, it however gives an undesirable space at the bottom of each
row, the same goes to deduce the font size.
I am thinking, perhaps it's best to combine yours and Georg'
suggestion, using table-row and table-cell for display element for
advance browsers, then feeds IE 6 and 7 the height with EM,. IE 7
has zoom feature like Opera, this maybe a more sensible approach?
Regards,
tee
*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
*******************************************************************