Re: Style rules to emulate HR

Ian Hickson writes:
> 
> This group has a long history of shooting down proposed CSS rules for
> styling the default look of <br> elements, so I figured here would be the
> best place to ask:
> 
> What is wrong with the following?
> 
>    br {
>      display: block;
>    }
> 
>    br:before {
>      content: "\A";
>      white-space: pre; /* in case white-space applies to :before */
>    }
> 
>    br[clear=left] {
>      clear: left;
>    }
> 
>    br[clear=right] {
>      clear: right;
>    }
> 
>    br[clear=all] {
>      clear: both;
>    }
> 
> (Other than the minor issue that for backwards compatability, the both
> value for clear should actually clear the _bottom_ of the <br> and not the
> top, like the rules above do.)

You will get an empty line too many.

The main problem of BR is that the first BR just starts a new line,
without adding any vertical whitespace, but the second and subsequent
ones create whitespace.

Setting the content of BR to "\A" (while keeping BR inline) will model 
that accurately, but doesn't allow for 'clear' to apply.

So how about:

    br              {content: "\A"; display: inline}

    br[clear]       {content: ""; display: block}
    br[clear=left]  {clear: left}
    br[clear=right] {clear: right}
    br[clear=all]   {clear: both}

(In CSS2, the 'content' property has to be put on the ':before'
pseudo-element, of course.)


Bert
-- 
  Bert Bos                                ( W 3 C ) http://www.w3.org/
  http://www.w3.org/people/bos/                              W3C/INRIA
  bert@w3.org                             2004 Rt des Lucioles / BP 93
  +33 (0)4 92 38 76 92            06902 Sophia Antipolis Cedex, France

Received on Friday, 23 February 2001 15:14:15 UTC