|
|
Posted by rf on 10/14/05 04:40
Neredbojias wrote:
> With neither quill nor qualm, rf quothed:
>
>> Neredbojias wrote:
>>
>>> With neither quill nor qualm, rf quothed:
>>>
>>>> guttyguppy@gmail.com wrote:
>>>>
>>>>> Check out http://fieldii.com/pain.html in firefox, and then in IE6.
>>>>> Notice the callouts getting covered up in IE6? Is there a hack?
>>>>
>>>> Yes (Nerodbojias) there is a hack.
>>>>
>>>> Negative margins will not allow (in IE) the callouts to break outside their
>>>> container but relative positioning will.
>>>>
>>>> For the left, remove
>>>> margin: left;
>>>>
>>>> Add
>>>> position: relative; left: -50px;
>>>>
>>>> To fix up the text flow change
>>>> margin-right: 10px;
>>>> to
>>>> margin-right: -40px;
>>>>
>>>> Similar (but the other way round) for the right callout:
>>>>
>>>> position: relative;
>>>> left: 50px;
>>>> margin-left: -40px;
>>>
>>> Well, I was going for a hack for the floats. Anybody could do it with
>>> relative positioning.
>>
>> It's relatively positioned *as well as* floated.
>
> I see. I was under the impression that positioned elements could not be
> floated...
> (w3c css2 spec re. floats: "Applies to: all but positioned elements and
> generated content")
I'm looking at the css2.1 draft but it says:
http://www.w3.org/TR/CSS21/visuren.html#propdef-float
"[float] only applies to elements that generate boxes that are not
*absolutely positioned*" <checks/> yep, css2 says that as well.
> ...but apparently by "positioned elements" the illustrious wucccy meant
> "absolutely positioned" elements which further seem to mean elements
> positioned in either the absolute or fixed variety (but not relative).
Correct, however said wucccy probably meant "taken out of the flow".
Absolute and fixed positioned elements are taken out of the flow and so
float would have no meaning for them. There is nowhere to float them *to*.
Taken the other way round, if an element is both floated *and* absolutely
positioned where does it live? You can't absolutely position it and then
float it, it can't float anywhere. Say you float it first. Then, by
absolutely positioning it, you take it out of the flow and float no longer
has any meaning. The two are mutually exclusive.
Relatively positioned elements are not, however, taken out of the flow. The
relative positioning happens *after* the page has been layed out. What
position relative means is: lay out the page and then *move* this element
by a certain amount. A floated element is just another element in the flow.
True, it has been moved (relative to its containing element) but it is
still in the flow and can be relatively positioned.
Relative and float are not mutually exclusive.
IMHO there is confusion in here. Relative should not be a value for the
position property but rather a seperate property/value thing. Absolute
happens before the rest of the page is layed out. Relative happens *after*
the page is layed out. Also, ISTM that one could conceivably relatively
position an absolutely positioned element. That is, position it *here* but
then *move* it by this amount .
Why are absolute and realitive mutually exclusive? Well, one reason is that
they are both values for the same property :-)
Furthur to this is rule one under floats: "The outer edge of the left
floating box may not be to the left edge of its containing block".
FF is behaving correctly here as the floated elements containing block is
the <body> element (since no ancestor blocks have position mentioned (well,
not true in this example, there is a container div that has position
relative but that is another matter, as is the rather bad CSS used to
position the various bits on this page))
IE Is not behaving correctly. IE seems to be considering the floated
elements immediate parent to be its containing element. Broken box model
probably, even though the page is not firing quirks mode.
> Nice fix, btw.
Thanks.
--
Cheers
Richard.
[Back to original message]
|