Re: [css-d] padding or margin differences between Firefox3 for the Mac and Firefox3 for the pc
The current layout demands that the content area be flush left AND flush right which didn't allow for differences in margins and padding. In the proposed layout, besides changing the doctype , I have adjusted it so the the content area can be either flush right OR flush left allowing for differences in margins and paddings between browsers, mostly by changing the background colors. This means I can get rid of hacks and simplify the IE stylesheets. Thank you for all your help and allowing me to see what the future held for the current layout. Nancy Johnson On Fri, Sep 19, 2008 at 8:04 AM, Philippe Wittenbergh [EMAIL PROTECTED] wrote: On Sep 19, 2008, at 1:16 AM, Nancy Johnson wrote: I was having the same problem before with safari and someone suggested body: first of type. I am concerned that it breaks in Firefox 3.1. 1. Since you'll be using a doctype that triggers strict mode, if I understood correctly,, the difference you saw between WebKit (Safari) and Gecko (Firefox) will disappear, making your little hack unnecessary (the difference is due to a different box-model interpretation in quirks mode). 2. If you're not using a doctype that triggers strict (standard compliant mode), you should. That levels of the differences between browsers. And you'll simplify your life. A refresher on doctypes: http://hsivonen.iki.fi/doctype/ PS-1: Fx 3.1 is not yet ought. A beta is due in October somewhere. The behaviour I mentioned won't change, though. PS-2: bottom-posting, please, when replying to the list. Thank you. Philippe --- Philippe Wittenbergh http://l-c-n.com/ __ css-discuss [EMAIL PROTECTED] 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] padding or margin differences between Firefox3 for the Mac and Firefox3 for the pc
On Sep 19, 2008, at 1:16 AM, Nancy Johnson wrote: I was having the same problem before with safari and someone suggested body: first of type. I am concerned that it breaks in Firefox 3.1. 1. Since you'll be using a doctype that triggers strict mode, if I understood correctly,, the difference you saw between WebKit (Safari) and Gecko (Firefox) will disappear, making your little hack unnecessary (the difference is due to a different box-model interpretation in quirks mode). 2. If you're not using a doctype that triggers strict (standard compliant mode), you should. That levels of the differences between browsers. And you'll simplify your life. A refresher on doctypes: http://hsivonen.iki.fi/doctype/ PS-1: Fx 3.1 is not yet ought. A beta is due in October somewhere. The behaviour I mentioned won't change, though. PS-2: bottom-posting, please, when replying to the list. Thank you. Philippe --- Philippe Wittenbergh http://l-c-n.com/ __ css-discuss [EMAIL PROTECTED] 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] padding or margin differences between Firefox3 for the Mac and Firefox3 for the pc
Nancy Johnson wrote: I have a div entitled content and a very dark gray and it houses two divs leftnav and contentcopy. leftnav has no background color, contentcopy is a lighter gray. Firefox 3 for the Mac you can see content div appear on the right as a thin line whereas Firefox3 for the PC it is hidden as it should be. In the past, I have had to give slightly different widths to the leftnav for each browser including using a hack for Safari to achieve this affect. http://www-odi.nhtsa.dot.gov/ewr/. Is there a way to fix this? Thanks in advance Nancy Viewing your page side by side on the screen at the same time in FF/3.0.1 in mac os x 10.4.11 and xp, I see no difference between them? __ css-discuss [EMAIL PROTECTED] 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] padding or margin differences between Firefox3 for the Mac and Firefox3 for the pc
On Sep 18, 2008, at 9:08 PM, Nancy Johnson wrote:
There is one other issue between Firefox3 for the pc and Firefox3 for
the mac. It doesn't seem to matter the doctype. What is live is
standards but an old doctype.
I have a div entitled content and a very dark gray and it houses two
divs leftnav and contentcopy. leftnav has no background color,
contentcopy is a lighter gray.
Firefox 3 for the Mac you can see content div appear on the right as a
thin line whereas Firefox3 for the PC it is hidden as it should be. In
the past, I have had to give slightly different widths to the leftnav
for each browser including using a hack for Safari to achieve this
affect. http://www-odi.nhtsa.dot.gov/ewr/.
Is there a way to fix this?
Your document is in Quirks mode currently (not that it matters much).
#shell { /*style.css (line 14)*/
...
width:51.25em;
}
descendant elements ( the two columns) also have a width set in ems
The difference you see is due to
1/ different rounding on different platforms due to subpixel rendering
2/ possibly slight differences between platforms
And rounding 'errors' handled differently by different rendering
engines, esp if you go down to 2 digits after the comma (like padding
0.19em). See also below.
BTW, on my Firefox nightly build (what will be FX 3.1 next year), the
right column drops below the left column. The right column is too wide
to fit next to the left column.
You use this (hack)
body:first-of-type .contentcopy { /*style.css (line 201)*/
width: 41.38em;
}
recognised by aforementioned nightly build, but not by Firefox 3.0x, I
_guess_ you used that hack to filter for Safari.
Safari computes the width to 662px, where as Fx 3.1b1pre nightly build
computes it 668px.
Recommendation: don't do this. Hack the death, but leave the living
ones alone [1].
If I were you, I wouldn't float the right column at all, but just give
it left-margin as appropriate (9.5em I think).
[1] browsers that is...
Philippe
---
Philippe Wittenbergh
http://l-c-n.com/
__
css-discuss [EMAIL PROTECTED]
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] padding or margin differences between Firefox3 for the Mac and Firefox3 for the pc
Thank you for your suggestions.
I am updating the stylesheet and already converted the remaining px I
must have missed the first time round to ems. I am also changing the
doctype xhtml in the newer files to XHTML. It is a tight layout since
I took it from a older tabular look and feel.
I did choose the float: right solution although it sometimes leaves a
small space on the left. Although this solution won't be live for
awhile. I was having the same problem before with safari and someone
suggested body: first of type.
I am concerned that it breaks in Firefox 3.1. I have had that problem
before only when the laptop computer uses an odd monitor display and
only in the IE browsers so I was able to come up with a fix.
Lots to think about
Nancy
On Thu, Sep 18, 2008 at 9:03 AM, Philippe Wittenbergh [EMAIL PROTECTED] wrote:
On Sep 18, 2008, at 9:08 PM, Nancy Johnson wrote:
There is one other issue between Firefox3 for the pc and Firefox3 for
the mac. It doesn't seem to matter the doctype. What is live is
standards but an old doctype.
I have a div entitled content and a very dark gray and it houses two
divs leftnav and contentcopy. leftnav has no background color,
contentcopy is a lighter gray.
Firefox 3 for the Mac you can see content div appear on the right as a
thin line whereas Firefox3 for the PC it is hidden as it should be. In
the past, I have had to give slightly different widths to the leftnav
for each browser including using a hack for Safari to achieve this
affect. http://www-odi.nhtsa.dot.gov/ewr/.
Is there a way to fix this?
Your document is in Quirks mode currently (not that it matters much).
#shell { /*style.css (line 14)*/
...
width:51.25em;
}
descendant elements ( the two columns) also have a width set in ems
The difference you see is due to
1/ different rounding on different platforms due to subpixel rendering
2/ possibly slight differences between platforms
And rounding 'errors' handled differently by different rendering engines,
esp if you go down to 2 digits after the comma (like padding 0.19em). See
also below.
BTW, on my Firefox nightly build (what will be FX 3.1 next year), the right
column drops below the left column. The right column is too wide to fit next
to the left column.
You use this (hack)
body:first-of-type .contentcopy { /*style.css (line 201)*/
width: 41.38em;
}
recognised by aforementioned nightly build, but not by Firefox 3.0x, I
_guess_ you used that hack to filter for Safari.
Safari computes the width to 662px, where as Fx 3.1b1pre nightly build
computes it 668px.
Recommendation: don't do this. Hack the death, but leave the living ones
alone [1].
If I were you, I wouldn't float the right column at all, but just give it
left-margin as appropriate (9.5em I think).
[1] browsers that is...
Philippe
---
Philippe Wittenbergh
http://l-c-n.com/
__
css-discuss [EMAIL PROTECTED]
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/
