Re: [css-d] overflow boxes next to floats

2010-03-22 Thread Philippe Wittenbergh

On Mar 23, 2010, at 12:27 AM, Bruno Fassino wrote:

 The behavior of 'block formatting context roots' in presence of float
 is not exactly defined in the spec, however all modern browsers
 usually display them beside the float, making them narrower.
 
 I've recently noticed a strange behavior, both in Firefox 3+ and IE8,
 occurring with boxes having overflow different from visible. Assume
 there is a right float and then an overflow box with a negative left
 margin. The box is rendered beside the float, but its margin is
 ignored in Firefox 3+ and IE8. More details and test cases here [1].
 I don't see any reason for such behavior, which looks simply wrong.
 The strange thing is that it did not occur in Firefox 2 and IE7, so I
 wonder if it could be intended. Has someone any ideas?
 
 [1] http://brunildo.org/test/bfc-neg-marg-float.html
>>> 
>>> I not sure why this happens. I see that moving the position of the
>>> overflow box by a top margin (positive or negative) causes the
>>> overflow box to not ignore the left margin with -100px and for the
>>> overflow box not to be shorten by the float [1]. The last test with
>>> the overflow box with margin-top:-0.01em doesn't seem to be any lower
>>> visually.
>>> 
>>> 1. 
>> 
>> Another weird one. The top margin seems to "disabled" the block formatting
>> context (it does not make the box shorter for the float). Imho, that one
>> goes against the spec.
> 
> 
> Yes, in the case with small negative top margin, Firefox seems to no
> more "see" the float. And this seems against the spec.
> (the case with top margin greater that the float, it's OK because the
> box is already below the float).

That is not limited to only Gecko (tested 1.9.2/Fx3.6 and the latest nightly 
1.9.3a pre). I see the same behaviour with recent WebKit nightly builds, Safari 
4.05 and Opera 10.5.
I tested this with 
.box { margin-top:-.1em; }

Two other observations:
1. When I make the window small enough, Gecko moves the blue BFC box that has a 
width applied to the left/right (test case 6a/6b). The window must be small 
enough that the width of the box is larger than the available space.

2. Nightly WebKit builds: the blue BFC box with auto width and negative margin 
is dropped below the floated box. This is different from what Safari 4.05 does 
(this is also visible with the latest Chrome build on OS X - 5.0.356.2).

Bruno:
> I see indeed that Firefox ignores a negative margin on the same side
> of the float as well.
> ...

> Moreover, the spec now says:
> "the _border box_ of a table, block-level replaced element, or element
> in the normal flow that establishes a new block formatting context
> must not overlap any floats in the same block formatting context".
> 
> They mention the "border box" and not the "margin box", so at least on
> the same side of the float, ignoring a negative margin is probably not
> so wrong?

That part is the correct behaviour, I think. If you give the box a (small) 
positive margin on the same side of the float, it will be ignored. If that 
margin is larger than the width of the float, it will be visible (Firefox 2.0 , 
IE 7 were all wrong; to be fair to Fx 2.0, the spec changed after it was 
released).

With a negative margin, WebKit and Safari 4.05 do some strange things.

I don't have any good explanation for all that negative margin behaviour. Yet…

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] div not floating in FF

2010-03-22 Thread Nancy
Dennis wrote:
>  if you want to have the two floating divs side-by-side, 
> I do believe you need to give them a width value

And apparently he is correct.
Thank you.
Nancy
__
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] Styling forms with CSS

2010-03-22 Thread Skip Knox
Same here. The form looks fine, although the Comments field protrudes a bit
on the right.

WRT the tabbing, I did eventually get to the radio buttons -- after tabbing
past Submit, up to the navigation and by way of the email. Tab order!

Skip Knox
Boise State University



On Mon, Mar 22, 2010 at 1:22 PM, David Hucklesby wrote:

> On 3/22/10 5:48 AM, Chad Chelius wrote:
> > I've created a form page for a web site and have styled it using
> > CSS. I've noticed that in Safari it looks as I would expect it to
> > however when viewed in Firefox or IE it breaks, meaning that all of
> > the fields I've formatted shift and even cover up some of the text in
> > the form. I'd appreciate anyone's thoughts on this issue. The URL is
> > at http://aj-procleaning.com/Contact/
>
> Odd. In Safari 4 (Mac) this end, the "last name" field wraps to a second
> line. Is this what you expect?
>
> OTOH I am not seeing the behavior you describe, nor do I see any styling
> applied to the form fields in your CSS. Can you tell us on which
> browser(s) and OS you see this?
>
> BTW - I notice that tabbing through the form, I cannot reach the radio
> buttons...
>
> Cordially,
> David
> --
>
>
> __
> 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] Styling forms with CSS

2010-03-22 Thread David Hucklesby
On 3/22/10 5:48 AM, Chad Chelius wrote:
> I've created a form page for a web site and have styled it using
> CSS. I've noticed that in Safari it looks as I would expect it to
> however when viewed in Firefox or IE it breaks, meaning that all of
> the fields I've formatted shift and even cover up some of the text in
> the form. I'd appreciate anyone's thoughts on this issue. The URL is
> at http://aj-procleaning.com/Contact/

Odd. In Safari 4 (Mac) this end, the "last name" field wraps to a second
line. Is this what you expect?

OTOH I am not seeing the behavior you describe, nor do I see any styling
applied to the form fields in your CSS. Can you tell us on which
browser(s) and OS you see this?

BTW - I notice that tabbing through the form, I cannot reach the radio
buttons...

Cordially,
David
--


__
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] div not floating in FF

2010-03-22 Thread Thierry Koblentz
> > Other than that, if you want to have the two floating divs side-by-
> side, I do believe you need to give them a width value - otherwise they
> will assume 100% width.

Floats do not assume 100% width, if there is no width specified they "shrink
wrap".


--
Regards,
Thierry 
www.tjkdesign.com | articles and tutorials
www.ez-css.org | ultra light CSS framework






__
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] div not floating in FF

2010-03-22 Thread Claude Needham
> -Original Message-
> Other than that, if you want to have the two floating divs side-by-side, I do 
> believe you need to give them a width value - otherwise they will assume 100% 
> width.
> Dennis

The width value of the two inner div is indeed the direction to look.
If you replace the right text content with an image than the two divs
will float nicely side by side. However, with the text content the div
will expand as much as necessary to accommodate the text. You can
either use  to cut the text into short lines. Or, put a width on
the containing div.

Claude
__
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] div not floating in FF

2010-03-22 Thread Dennis Bixler
-Original Message-
From: css-d-boun...@lists.css-discuss.org 
[mailto:css-d-boun...@lists.css-discuss.org] On Behalf Of nancy
Sent: Monday, March 22, 2010 1:11 PM
To: 'Climis, Tim'; css-d@lists.css-discuss.org
Subject: Re: [css-d] div not floating in FF

Was using the tag attribute clear, not the style attribute.
But I tried changing it to the style clear:both to no avail.
Thanks anyway.

-Original Message-
From: Climis, Tim [mailto:tcli...@indiana.edu] 
Sent: Monday, March 22, 2010 12:05 PM
To: 'nancy'; 'css-d@lists.css-discuss.org'
Subject: RE: [css-d] div not floating in FF

> I have a break with a clear equals all below the outer div.

Clear: all is not a valid value.  Are you looking for clear: both?

---Tim

If you are trying to expand the wrapping div around the two floats you need to 
put the br tag inside the outer div right before the closing .

Other than that, if you want to have the two floating divs side-by-side, I do 
believe you need to give them a width value - otherwise they will assume 100% 
width.

Dennis
__
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] div not floating in FF

2010-03-22 Thread Thierry Koblentz
> Was using the tag attribute clear, not the style attribute.
> But I tried changing it to the style clear:both to no avail.
> Thanks anyway.

You should clear the floats while still inside the parent container, your
 is *after* that container.
Anyway, rather than using a , try overflow:hidden on the DIV containing
the float.


--
Regards,
Thierry 
www.tjkdesign.com | articles and tutorials
www.ez-css.org | ultra light CSS framework




 

__
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] div not floating in FF

2010-03-22 Thread nancy
Was using the tag attribute clear, not the style attribute.
But I tried changing it to the style clear:both to no avail.
Thanks anyway.

-Original Message-
From: Climis, Tim [mailto:tcli...@indiana.edu] 
Sent: Monday, March 22, 2010 12:05 PM
To: 'nancy'; 'css-d@lists.css-discuss.org'
Subject: RE: [css-d] div not floating in FF

> I have a break with a clear equals all below the outer div.

Clear: all is not a valid value.  Are you looking for clear: both?

---Tim

__
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] div not floating in FF

2010-03-22 Thread Climis, Tim
> I have a break with a clear equals all below the outer div.

Clear: all is not a valid value.  Are you looking for clear: both?

---Tim
__
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] div not floating in FF

2010-03-22 Thread nancy
I have a div containing 2 other divs, one is floated left, the other is
floated right. 
I have a break with a clear equals all below the outer div.
In Firefox and most browsers, the content of the right floated div is
appearing below the outer div.
In DreamWeaver and IE8 it is displaying "correctly."
What am I doing wrong?
See: http://thesmudge.com/shapeshifter/Untitled-1.html
TIA,
Nancy

__
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] overflow boxes next to floats

2010-03-22 Thread Thierry Koblentz
> I see indeed that Firefox ignores a negative margin on the same side
> of the float as well.
> 
> 
> The spec deliberately not very precise about these cases. At
>  http://www.w3.org/TR/CSS21/visuren.html#bfc-next-to-float
> there is
> "CSS2 does not define when a UA may put said element next to the float
> or by how much said element may become narrower"
> 
> So the UA are "allowed" to make those bfc "narrower" as they like :-)
> 
> 
> Moreover, the spec now says:
> "the _border box_ of a table, block-level replaced element, or element
> in the normal flow that establishes a new block formatting context
> must not overlap any floats in the same block formatting context".
> 
> They mention the "border box" and not the "margin box", so at least on
> the same side of the float, ignoring a negative margin is probably not
> so wrong?

I see... This is very interesting.
They can't use the term "margin box" since it is the implicit *margin* that
"escapes" the float, but then the term "border box" explains this behavior
pretty well (at least according to the spec). 
The problem for us is that this behavior is different across browsers (but
what else is new?).


--
Regards,
Thierry 
www.tjkdesign.com | articles and tutorials
www.ez-css.org | ultra light CSS framework




__
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] Jquery Dropdown menu showing behind listboxes in IE6

2010-03-22 Thread Thierry Koblentz
> The z-index doesn't seem to be working unfortunately.  Do you know of
> a good tutorial on Iframes?

Yes, this issue has nothing to do with z-index, it is because selects are
windowed elements.
Check any lightbox example, you'll see how an iframe is used to disable
these elements in IE6.


PS: please bottom post

--
Regards,
Thierry 
www.tjkdesign.com | articles and tutorials
www.ez-css.org | ultra light CSS framework




> On Mon, Mar 22, 2010 at 11:06 AM, Thierry Koblentz
>  wrote:
> >> I may have posted this question before, but couldn't find it when I
> >> searched the archives.
> >>
> >> I have a jquery drop-down menu, and on a few of the pages, there is
> >> listbox showing up in front of the drop down.  I could only
> replicate
> >> it in IE6 although a coleague was able to replicate it in Firefox.
> >>
> >> How can I make the list box show behind the drop down menu?
> >
> > Hi Nancy,
> >
> > You'll need to use an iframe to cover the select (put it behind the
> drop
> > down menus).

__
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] overflow boxes next to floats

2010-03-22 Thread Bruno Fassino
On Mon, Mar 22, 2010 at 4:00 PM, Thierry Koblentz
 wrote:
> Hi Bruno,
>>
>> I've recently noticed a strange behavior, both in Firefox 3+ and IE8,
>> occurring with boxes having overflow different from visible. Assume
>> there is a right float and then an overflow box with a negative left
>> margin. The box is rendered beside the float, but its margin is
>> ignored in Firefox 3+ and IE8. More details and test cases here [1].
>> I don't see any reason for such behavior, which looks simply wrong.
>> The strange thing is that it did not occur in Firefox 2 and IE7, so I
>> wonder if it could be intended. Has someone any ideas?
>
>
>> [1] http://brunildo.org/test/bfc-neg-marg-float.html
>
> Thanks for this.
>
> It is really strange/weird and seems to be the case for *both* sides of the
> box, not just the one opposite to the float.
> Did you try to apply a negative margin on the right *and* left sides of
> these block formatting contexts?


I see indeed that Firefox ignores a negative margin on the same side
of the float as well.


The spec deliberately not very precise about these cases. At
 http://www.w3.org/TR/CSS21/visuren.html#bfc-next-to-float
there is
"CSS2 does not define when a UA may put said element next to the float
or by how much said element may become narrower"

So the UA are "allowed" to make those bfc "narrower" as they like :-)


Moreover, the spec now says:
"the _border box_ of a table, block-level replaced element, or element
in the normal flow that establishes a new block formatting context
must not overlap any floats in the same block formatting context".

They mention the "border box" and not the "margin box", so at least on
the same side of the float, ignoring a negative margin is probably not
so wrong?


Best,
Bruno

-- 
Bruno Fassino http://www.brunildo.org/test
__
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] Jquery Dropdown menu showing behind listboxes in IE6

2010-03-22 Thread Nancy Johnson
The z-index doesn't seem to be working unfortunately.  Do you know of
a good tutorial on Iframes?

Thanks

Nancy

On Mon, Mar 22, 2010 at 11:06 AM, Thierry Koblentz
 wrote:
>> I may have posted this question before, but couldn't find it when I
>> searched the archives.
>>
>> I have a jquery drop-down menu, and on a few of the pages, there is
>> listbox showing up in front of the drop down.  I could only replicate
>> it in IE6 although a coleague was able to replicate it in Firefox.
>>
>> How can I make the list box show behind the drop down menu?
>
> Hi Nancy,
>
> You'll need to use an iframe to cover the select (put it behind the drop
> down menus).
>
>
> --
> Regards,
> Thierry
> www.tjkdesign.com | articles and tutorials
> www.ez-css.org | ultra light CSS framework
>
>
>
>
>
>
__
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] overflow boxes next to floats

2010-03-22 Thread Bruno Fassino
Hi Alan and Thierry,

On Mon, Mar 22, 2010 at 4:13 PM, Thierry Koblentz
 wrote:
> Hi Alan,
>
>> > The behavior of 'block formatting context roots' in presence of float
>> > is not exactly defined in the spec, however all modern browsers
>> > usually display them beside the float, making them narrower.
>> >
>> > I've recently noticed a strange behavior, both in Firefox 3+ and IE8,
>> > occurring with boxes having overflow different from visible. Assume
>> > there is a right float and then an overflow box with a negative left
>> > margin. The box is rendered beside the float, but its margin is
>> > ignored in Firefox 3+ and IE8. More details and test cases here [1].
>> > I don't see any reason for such behavior, which looks simply wrong.
>> > The strange thing is that it did not occur in Firefox 2 and IE7, so I
>> > wonder if it could be intended. Has someone any ideas?
>> >
>> > [1] http://brunildo.org/test/bfc-neg-marg-float.html
>>
>> I not sure why this happens. I see that moving the position of the
>> overflow box by a top margin (positive or negative) causes the
>> overflow box to not ignore the left margin with -100px and for the
>> overflow box not to be shorten by the float [1]. The last test with
>> the overflow box with margin-top:-0.01em doesn't seem to be any lower
>> visually.
>>
>> 1. 
>
> Another weird one. The top margin seems to "disabled" the block formatting
> context (it does not make the box shorter for the float). Imho, that one
> goes against the spec.


Yes, in the case with small negative top margin, Firefox seems to no
more "see" the float. And this seems against the spec.
(the case with top margin greater that the float, it's OK because the
box is already below the float).


Best,
Bruno

-- 
Bruno Fassino http://www.brunildo.org/test
__
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] overflow boxes next to floats

2010-03-22 Thread Thierry Koblentz
Hi Alan,

> > The behavior of 'block formatting context roots' in presence of float
> > is not exactly defined in the spec, however all modern browsers
> > usually display them beside the float, making them narrower.
> >
> > I've recently noticed a strange behavior, both in Firefox 3+ and IE8,
> > occurring with boxes having overflow different from visible. Assume
> > there is a right float and then an overflow box with a negative left
> > margin. The box is rendered beside the float, but its margin is
> > ignored in Firefox 3+ and IE8. More details and test cases here [1].
> > I don't see any reason for such behavior, which looks simply wrong.
> > The strange thing is that it did not occur in Firefox 2 and IE7, so I
> > wonder if it could be intended. Has someone any ideas?
> >
> > [1] http://brunildo.org/test/bfc-neg-marg-float.html
> 
> I not sure why this happens. I see that moving the position of the
> overflow box by a top margin (positive or negative) causes the
> overflow box to not ignore the left margin with -100px and for the
> overflow box not to be shorten by the float [1]. The last test with
> the overflow box with margin-top:-0.01em doesn't seem to be any lower
> visually.
> 
> 1. 

Another weird one. The top margin seems to "disabled" the block formatting
context (it does not make the box shorter for the float). Imho, that one
goes against the spec.


--
Regards,
Thierry 
www.tjkdesign.com | articles and tutorials
www.ez-css.org | ultra light CSS framework





__
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] Jquery Dropdown menu showing behind listboxes in IE6

2010-03-22 Thread Thierry Koblentz
> I may have posted this question before, but couldn't find it when I
> searched the archives.
> 
> I have a jquery drop-down menu, and on a few of the pages, there is
> listbox showing up in front of the drop down.  I could only replicate
> it in IE6 although a coleague was able to replicate it in Firefox.
> 
> How can I make the list box show behind the drop down menu?

Hi Nancy,

You'll need to use an iframe to cover the select (put it behind the drop
down menus).


--
Regards,
Thierry 
www.tjkdesign.com | articles and tutorials
www.ez-css.org | ultra light CSS framework





__
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] overflow boxes next to floats

2010-03-22 Thread Thierry Koblentz
Hi Bruno,

> The behavior of 'block formatting context roots' in presence of float
> is not exactly defined in the spec, however all modern browsers
> usually display them beside the float, making them narrower.
> 
> I've recently noticed a strange behavior, both in Firefox 3+ and IE8,
> occurring with boxes having overflow different from visible. Assume
> there is a right float and then an overflow box with a negative left
> margin. The box is rendered beside the float, but its margin is
> ignored in Firefox 3+ and IE8. More details and test cases here [1].
> I don't see any reason for such behavior, which looks simply wrong.
> The strange thing is that it did not occur in Firefox 2 and IE7, so I
> wonder if it could be intended. Has someone any ideas?


> [1] http://brunildo.org/test/bfc-neg-marg-float.html

Thanks for this.

It is really strange/weird and seems to be the case for *both* sides of the
box, not just the one opposite to the float.
Did you try to apply a negative margin on the right *and* left sides of
these block formatting contexts?


--
Regards,
Thierry 
www.tjkdesign.com | articles and tutorials
www.ez-css.org | ultra light CSS framework




__
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] overflow boxes next to floats

2010-03-22 Thread Alan Gresley
Bruno Fassino wrote:
> The behavior of 'block formatting context roots' in presence of float
> is not exactly defined in the spec, however all modern browsers
> usually display them beside the float, making them narrower.
> 
> I've recently noticed a strange behavior, both in Firefox 3+ and IE8,
> occurring with boxes having overflow different from visible. Assume
> there is a right float and then an overflow box with a negative left
> margin. The box is rendered beside the float, but its margin is
> ignored in Firefox 3+ and IE8. More details and test cases here [1].
> I don't see any reason for such behavior, which looks simply wrong.
> The strange thing is that it did not occur in Firefox 2 and IE7, so I
> wonder if it could be intended. Has someone any ideas?
> 
> 
> Regards,
> Bruno
> 
> [1] http://brunildo.org/test/bfc-neg-marg-float.html


I not sure why this happens. I see that moving the position of the 
overflow box by a top margin (positive or negative) causes the 
overflow box to not ignore the left margin with -100px and for the 
overflow box not to be shorten by the float [1]. The last test with 
the overflow box with margin-top:-0.01em doesn't seem to be any lower 
visually.



1. 



-- 
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/


[css-d] Jquery Dropdown menu showing behind listboxes in IE6

2010-03-22 Thread Nancy Johnson
Hi

I may have posted this question before, but couldn't find it when I
searched the archives.

I have a jquery drop-down menu, and on a few of the pages, there is
listbox showing up in front of the drop down.  I could only replicate
it in IE6 although a coleague was able to replicate it in Firefox.

How can I make the list box show behind the drop down menu?

Thanks in advance

Nancy
__
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] Styling forms with CSS

2010-03-22 Thread Chad Chelius
I've created a form page for a web site and have styled it using CSS. I've 
noticed that in Safari it looks as I would expect it to however when viewed in 
Firefox or IE it breaks, meaning that all of the fields I've formatted shift 
and even cover up some of the text in the form. I'd appreciate anyone's 
thoughts on this issue. The URL is at http://aj-procleaning.com/Contact/
__
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] overflow boxes next to floats

2010-03-22 Thread Bruno Fassino
The behavior of 'block formatting context roots' in presence of float
is not exactly defined in the spec, however all modern browsers
usually display them beside the float, making them narrower.

I've recently noticed a strange behavior, both in Firefox 3+ and IE8,
occurring with boxes having overflow different from visible. Assume
there is a right float and then an overflow box with a negative left
margin. The box is rendered beside the float, but its margin is
ignored in Firefox 3+ and IE8. More details and test cases here [1].
I don't see any reason for such behavior, which looks simply wrong.
The strange thing is that it did not occur in Firefox 2 and IE7, so I
wonder if it could be intended. Has someone any ideas?


Regards,
Bruno

[1] http://brunildo.org/test/bfc-neg-marg-float.html

-- 
Bruno Fassino http://www.brunildo.org/test
__
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/