Re: [css-d] The CSS Position Property

2010-12-16 Thread Philippe Wittenbergh

On Dec 16, 2010, at 7:39 PM, Chetan Crasta wrote:

>> It not that the spec disallowed it
> 
> The spec did explicitly disallow it, see point number 2:
> http://www.w3.org/TR/2009/CR-CSS2-20090423/visuren.html#dis-pos-flo

Better to quote the latest text:
http://www.w3.org/TR/CSS21/visuren.html#dis-pos-flo
(not that it makes much difference for this particular point).

> 
>> Absolutely positioned boxes are taken out of the normal flow
> 
> The phrase "taken out of the flow" is used a bit loosely in the spec.

Not really; I don't think the spec ever says that floated boxes are 'taken out 
of the flow', where as it is explicit about it when referring to absolute 
positioned boxes.
Compare the 1st 2 paragraphs of CSS2.1:9.5 with the definition of absolute 
positioning in 9.6.
http://www.w3.org/TR/CSS21/visuren.html#floats
http://www.w3.org/TR/CSS21/visuren.html#absolute-positioning

Granted the text in 9.5 also says 'not in the flow'...

> Both absolutely positioned and floated elements are out of the flow,
> the difference being that floated elements are still "visible" to
> inline boxes.

Floated boxes are shifted left or right with respect to the line of content but 
still participate in the general flow of said content, whereas absolute 
positioned elements are completely removed from the flow, and are sort of 
layered above it (or below it !).

> I'm not sure why the spec disallowed combining absolute positioning
> with floating, because it seems to be the only way an element could be
> stretched to the width or height of its auto-height containing element
> while being aligned to the left or right.

Because absolute positioning is ultimately orthogonal to float, by its nature 
it is not affected by the surrounding contents, as stated in 9.6.

On Dec 16, 2010, at 11:04 PM, Alan Gresley wrote:

> WebKit renders this test different to other browser.
> 
> 
> 
> This is due to where WebKit  places the float holder and something to do with 
> differences between line boxes and line-height in WebKit and other brwosers. 
> Philippe explains better.

Uh, Opera reders the same as Webkit (and last I checked, IE does the same). 
What I'm missing in your test ?

Gecko renders it differently. But read carefully about floated first-letter - 
second paragraph:
http://www.w3.org/TR/CSS21/selector.html#first-letter

This is what Gecko does:
[quote]
To allow UAs to render a typographically correct drop cap or initial cap, the 
UA may choose a line-height, width and height based on the shape of the letter, 
unlike for normal elements.
[/quote]

Philippe
---
Philippe Wittenbergh
http://l-c-n.com/





__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] The CSS Position Property

2010-12-16 Thread Alan Gresley

On 16/12/2010 9:39 PM, Chetan Crasta wrote:

It not that the spec disallowed it


The spec did explicitly disallow it, see point number 2:
http://www.w3.org/TR/2009/CR-CSS2-20090423/visuren.html#dis-pos-flo


Thank you, I was looking for that.


Absolutely positioned boxes are taken out of the normal flow


The phrase "taken out of the flow" is used a bit loosely in the spec.
Both absolutely positioned and floated elements are out of the flow,
the difference being that floated elements are still "visible" to
inline boxes.


No, "taken out of the flow" is not used a bit loosely.  When you have a 
float, a UA generates something called a float holder. This is used to 
check if a run on inline boxes can sit beside the float, or before the 
float. This can be examined in great detail by how FF, Safari, Opera and 
IE8+ positions the line boxes appearing before the floats on this page.


http://css-class.com/test/css/visformatting/float-inline-content.htm

Adjusting the width of the viewport (especially from Example 3a to 4b) 
shows how the inline boxes jumps above the float when the width of the 
series of line boxes and the width of the floats combined is greater 
then the width of their containing block (in this instance the body). 
Some examples in this test case fails in early versions of Gecko 1.9. I 
believe FF 3.5 had fixed the bug and IE7-.



Float holders also help browsers calculate when a line of floats should 
begin to drop. This is with or without line boxes.





Float holders also are used to help browsers know where to position line 
boxes (or with elements with a display value of inline) to properly flow 
around floats or better said, not having the text appear over the 
floats. See this test case which shows Safari 5 still failing two test.





WebKit renders this test different to other browser.



This is due to where WebKit  places the float holder and something to do 
with differences between line boxes and line-height in WebKit and other 
brwosers. Philippe explains better.




I'm not sure why the spec disallowed combining absolute positioning
with floating, because it seems to be the only way an element could be
stretched to the width or height of its auto-height containing element
while being aligned to the left or right.
http://roughtech.com/t/posit.html example 5 and 6.

~Chetan



I do not know what you mean by "the only way an element could be 
stretched to the width or height of its auto-height containing element 
while being aligned to the left or right." What do you mean by stretched?



--
Alan http://css-class.com/

Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] The CSS Position Property

2010-12-16 Thread Chetan Crasta
> http://barneycarroll.com/floatAndPos.html
> Assigned float properties are computed, they just don't take effect.

Firebug shows computed value of float as none on an element with
position:absolute and float:left or float:right

~Chetan
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] The CSS Position Property

2010-12-16 Thread Chetan Crasta
> It not that the spec disallowed it

The spec did explicitly disallow it, see point number 2:
http://www.w3.org/TR/2009/CR-CSS2-20090423/visuren.html#dis-pos-flo

> Absolutely positioned boxes are taken out of the normal flow

The phrase "taken out of the flow" is used a bit loosely in the spec.
Both absolutely positioned and floated elements are out of the flow,
the difference being that floated elements are still "visible" to
inline boxes.

I'm not sure why the spec disallowed combining absolute positioning
with floating, because it seems to be the only way an element could be
stretched to the width or height of its auto-height containing element
while being aligned to the left or right.
http://roughtech.com/t/posit.html example 5 and 6.

~Chetan
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] The CSS Position Property

2010-12-16 Thread Barney Carroll
Chetan, Philippe:

http://barneycarroll.com/floatAndPos.html

Assigned float properties are computed, they just don't take effect.

Regards,
Barney Carroll

barney.carr...@gmail.com
07594 506 381


On 16 December 2010 10:12, Alan Gresley  wrote:

> On 16/12/2010 6:28 PM, Chetan Crasta wrote:
>
>> @Thierry: Happy to help.
>>
>>  the element is taken out of flow, thus float is rendered impotent
>>>
>>
>> @Barney: It doesn't necessarily follow that because the element is out
>> of the flow, float cannot work. If the spec hadn't disallowed it, it
>> would be conceivable for position:absolute and float to be used
>> together to get the combined effect of 5) and 6), that is: a
>> stretched, right or left aligned element, with text or inline elements
>> flowing around it.
>> http://roughtech.com/t/posit.html (corrected)
>>
>> ~Chetan
>>
>
> Hello Chetan,
>
> It not that the spec disallowed it, but rather float is one of the three
> positioning schemes [1]. They being:
>
> 1. Normal flow.
> 2. Floats - laid out according to the normal flow, then taken out of the
> flow.
> 3. AP. - removed from the normal flow entirely (it has no impact on later
> siblings).
>
> In 9.3.1 Choosing a positioning scheme: 'position' property [2] we see this
> for position absolute:
>
>  # Absolutely positioned boxes are taken out of the normal flow. This means
>  # they have no impact on the layout of later siblings. Also, though
> absolutely
>  # positioned boxes have margins, they do not collapse with any other
> margins.
>
>
> 1. 
> 2. 
>
>
> --
> Alan http://css-class.com/
>
> Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo
>
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] The CSS Position Property

2010-12-16 Thread Alan Gresley

On 16/12/2010 6:28 PM, Chetan Crasta wrote:

@Thierry: Happy to help.


the element is taken out of flow, thus float is rendered impotent


@Barney: It doesn't necessarily follow that because the element is out
of the flow, float cannot work. If the spec hadn't disallowed it, it
would be conceivable for position:absolute and float to be used
together to get the combined effect of 5) and 6), that is: a
stretched, right or left aligned element, with text or inline elements
flowing around it.
http://roughtech.com/t/posit.html (corrected)

~Chetan


Hello Chetan,

It not that the spec disallowed it, but rather float is one of the three 
positioning schemes [1]. They being:


1. Normal flow.
2. Floats - laid out according to the normal flow, then taken out of the 
flow.
3. AP. - removed from the normal flow entirely (it has no impact on 
later siblings).


In 9.3.1 Choosing a positioning scheme: 'position' property [2] we see 
this for position absolute:


  # Absolutely positioned boxes are taken out of the normal flow. This 
means
  # they have no impact on the layout of later siblings. Also, though 
absolutely
  # positioned boxes have margins, they do not collapse with any other 
margins.



1. 
2. 


--
Alan http://css-class.com/

Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] The CSS Position Property

2010-12-15 Thread Chetan Crasta
Sorry, here's the link: http://roughtech.com/t/posit.html

~C

On Thu, Dec 16, 2010 at 12:58 PM, Chetan Crasta  wrote:
> @Thierry: Happy to help.
>
>> the element is taken out of flow, thus float is rendered impotent
>
> @Barney: It doesn't necessarily follow that because the element is out
> of the flow, float cannot work. If the spec hadn't disallowed it, it
> would be conceivable for position:absolute and float to be used
> together to get the combined effect of 5) and 6), that is: a
> stretched, right or left aligned element, with text or inline elements
> flowing around it.
> http://roughtech.com/t/posit.html
>
> ~Chetan
>
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] The CSS Position Property

2010-12-15 Thread Chetan Crasta
@Thierry: Happy to help.

> the element is taken out of flow, thus float is rendered impotent

@Barney: It doesn't necessarily follow that because the element is out
of the flow, float cannot work. If the spec hadn't disallowed it, it
would be conceivable for position:absolute and float to be used
together to get the combined effect of 5) and 6), that is: a
stretched, right or left aligned element, with text or inline elements
flowing around it.
http://roughtech.com/t/posit.html

~Chetan
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] The CSS Position Property

2010-12-15 Thread Thierry Koblentz
> >> > I thought this article could be of interest to this list:
> >> >  property/>
> 
> > I believe the article says that already.
> > Check the first bullet point in the "Things to remember" about
> > position:absolute. It says:
> >
> > For *any* 'absolute' or 'fixed' positioned element the computed value
> for
> > display is block.
> 
> Yes, I noticed this later.
> 
> One point which I think is not mentioned in the article is: On
> absolutely and fixed positioned elements, the computed value of float
> is none, regardless of any float declarations.

Good point, I forgot to mention this in the article.
Thanks!

--
Regards,
Thierry
www.tjkdesign.com | www.ez-css.org | @thierrykoblentz

__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] The CSS Position Property

2010-12-15 Thread Barney Carroll
Chetan, it's more of a case — as the article clearly explains — that the 
element is taken out of flow, thus float is rendered impotent.

Sent from my iPod

On 15 Dec 2010, at 18:09, Chetan Crasta  wrote:

 I thought this article could be of interest to this list:
 
> 
>> I believe the article says that already.
>> Check the first bullet point in the "Things to remember" about
>> position:absolute. It says:
>> 
>> For *any* 'absolute' or 'fixed' positioned element the computed value for
>> display is block.
> 
> Yes, I noticed this later.
> 
> One point which I think is not mentioned in the article is: On
> absolutely and fixed positioned elements, the computed value of float
> is none, regardless of any float declarations.
> 
> ~Chetan
> __
> css-discuss [cs...@lists.css-discuss.org]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> List policies -- http://css-discuss.org/policies.html
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Re: [css-d] The CSS Position Property

2010-12-15 Thread Chetan Crasta
>> > I thought this article could be of interest to this list:
>> > 

> I believe the article says that already.
> Check the first bullet point in the "Things to remember" about
> position:absolute. It says:
>
> For *any* 'absolute' or 'fixed' positioned element the computed value for
> display is block.

Yes, I noticed this later.

One point which I think is not mentioned in the article is: On
absolutely and fixed positioned elements, the computed value of float
is none, regardless of any float declarations.

~Chetan
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] The CSS Position Property

2010-12-15 Thread Thierry Koblentz
Hi Chetan,

> > I thought this article could be of interest to this list:
> > 
> 
> That's a nice informative summary of positioning. It would also be
> worthwhile mentioning that absolutely and fixed positioned inline
> elements can be sized with width and height declarations.

I believe the article says that already.
Check the first bullet point in the "Things to remember" about
position:absolute. It says:

For *any* 'absolute' or 'fixed' positioned element the computed value for
display is block.


Thanks a lot for your feedback.

--
Regards,
Thierry
www.tjkdesign.com | www.ez-css.org | @thierrykoblentz

__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] The CSS Position Property

2010-12-14 Thread Chetan Crasta
> I thought this article could be of interest to this list:
> 

That's a nice informative summary of positioning. It would also be
worthwhile mentioning that absolutely and fixed positioned inline
elements can be sized with width and height declarations.

http://roughtech.com/t/posit.html

~Chetan
__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


[css-d] The CSS Position Property

2010-12-14 Thread Thierry Koblentz
I thought this article could be of interest to this list:



--
Regards,
Thierry
www.tjkdesign.com | www.ez-css.org | @thierrykoblentz



__
css-discuss [cs...@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/