[EMAIL PROTECTED] blurted out:
Hey, this is my first attempt at making up a tutorial. By all means correct me on anything that's wrong :) ... this goes out to all you CSS Hack gripers on here heh. Enjoy.
http://web.theward.net/dodgingcsshacks.html
You might want to make sample pages for each of the examples.
Your method 2 doesn't work in Firebird 0.7 (I'm waiting on extensions before I move to Firefox), and probably not in any of the browsers with working box models.
Plus it is flawed in and of itself, since neither of the boxes are floating, so they just stack vertically. And you left off the # in the background color of the second box.
You can compensate a bit by adding negative margin to offset the border + padding, but that makes the IE version shrink to the left.
Alteratively, you can not set the width of the second box at all, which results in a 50/50 split in IE, and one that is off by either 10 or 20 pixels (I don't have the eye to tell) in Firebird.
Here's the CSS (for just the boxes) for that strategy:
#box_a {
width: 50%;
padding: 10px;
background: #eee;
float: left;
}#box_b {
background: #bbb;
padding: 10px;
}*****************************************************
The discussion list for http://webstandardsgroup.org/
*****************************************************
