Replace padding: 1em 0; with padding: 0 1em; :)
Original Message:
>From: "russ weakley" <[EMAIL PROTECTED]>
>To: <[EMAIL PROTECTED]>
>Subject: re: [WSG] "Dodging CSS Hacks" Tutorial
>Date: Fri 13 Feb 2004 07:56:24 +1100
>Hi Ryan,
>Excellent article! Can I suggest a couple of small points:
>
>Within the section "Method One: Don't use padding and borders", this seems a bit of a
>sweeping statement :
>"Please note, your code WILL be more lengthy"
>
>There are times when this method is much longer in CSS code and other times when it
>isn't - it really depends on specific examples. In your example, the code is much
>longer, but it might be better to make a less definitive statement like:
>"Please note, your code COULD be more lengthy"
>
>There are also a couple of other methods of getting around the box model problem.
>Like any method they have weaknesses, but should be mentioned:
>
>1. Double nested divs. You apply no padding to the outer div, and padding to the
>inner div - without setting a width. This is not a very semantically correct option
>(due to extra divs), but it has been widely used.
>
>HTML
><div class="outer">
> <div class="inner"></div>
></div>
>
>CSS
>.outer { width: 200px; }
>.inner { padding: 1em 0; }
>
>2. Padding the content. This is similar to Method 1 but needs to be explained as it
>is a simple and powerful option. It involves applying padding to content within the
>div, rather than the div itself - this is a very common solution to the problem, and
>can be achieved using one CSS rule set like:
>
>#container p, #container h1, #container h2 { padding: 1em 0; }
>
>It may also be worth outlining the pro's and con's of each method so that users can
>chose one which is more semantically correct, or possibly easier to execute.
>
>Be warned, I slapped together the code samples above in both examples and they
>haven't been tested on anything. :)
>
>Anyway, a great article and a great idea!
>Russ
>
>
>>
>> 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
>>
>> --Ryan Christie
>> http://www.theward.net
>
>*****************************************************
>The discussion list for http://webstandardsgroup.org/
>*****************************************************
>
>
*****************************************************
The discussion list for http://webstandardsgroup.org/
*****************************************************
