W3C home > Mailing lists > Public > www-style@w3.org > February 2000

Re: Horizontal rules

From: Matthew Brealey <thelawnet@yahoo.com>
Date: Thu, 17 Feb 2000 09:06:18 -0800 (PST)
Message-ID: <20000217170618.2251.qmail@web902.mail.yahoo.com>
To: www-style@w3.org
--- Allan Odgaard <Duff@DIKU.DK> wrote:
> On 17-Feb-00, Matthew Brealey wrote:
> 
> >> <Div>
> >>    <Img Align=Left Width=200 ...>
> >>    <Hr>
> >> </Div>
> > I'm not sure I understand what you are saying.
> > I presume you mean that the DIV is floating.
> 
> No, it was the image that I wanted to float (to the left), the 'div' was
> just a
> dummy container. Normally the above would be rendered as:
> 
> +---------------- div ---------------+
> | +-------+                          |
>   |       | ========== HR ==========
>   | Image |
>   |       |
>   +-------+
No.
This is the correct rendering, assuming the HR's margin-top is equal to
the IMG's padding-top + margin-top.
+---------------- div ---------------+
|=+-------+=========== HR ===========|                          |
| |       |
  | Image |
  |       |
  +-------+
The HR is not affected by the image.

It is drawn in exactly the same place as it would other wise have been,
with the exception that floats are always rendered on top, so it appears
that the HR is cut off when behind the image when it is actually on a
lower vertical plane. 

Floats are one of the two exceptions to the 'later elements in the
document tree stack on top' rule (the other being z-index).
 
> But for CSS where the HR element becomes a block level box then it will
> get the
> width of its parent without respecting any floating objects (though its
> potential inline children will) -- so the border of this block level HR
> box
> will collide with the image like this:
> +---------------- div ---------------+
> | +-------+                          |
>   |=======|====== HR ===============
>   | Image |
>   |       |
>   +-------+
No:

<q cite="http://www.w3.org/TR/REC-CSS2/visuren.html#floats">
When a block box overlaps, the background and borders of the block box are
rendered behind the float and are [sic] only be visible where the box is
transparent. 
</q>


=====
----------------------------------------------------------
From Matthew Brealey (http://members.tripod.co.uk/lawnet (for law)or http://members.tripod.co.uk/lawnet/WEBFRAME.HTM (for CSS))
__________________________________________________
Do You Yahoo!?
Talk to your friends online with Yahoo! Messenger.
http://im.yahoo.com
Received on Thursday, 17 February 2000 12:06:21 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Monday, 27 April 2009 13:54:04 GMT