Ie Styles, and the lack thereof
March 26, 2004 3:06 AM Subscribe
CSS - Does anyone know how to get me around an IE style sheet problem? Mozilla shows the right text box correctly while IE goes off and does it's own thing. Any suggestions?
Do you know that the text doesn't even show up in Safari?
posted by jpburns at 5:08 AM on March 26, 2004
posted by jpburns at 5:08 AM on March 26, 2004
The only difference I can see between IE6/XP and Firefox 0.8/XP is that the squiggle has a coloured background in IE but not in Firefox.
posted by dg at 5:20 AM on March 26, 2004
posted by dg at 5:20 AM on March 26, 2004
Response by poster: interesting.
In my browsers I have IE doing a full page scroll and Firebird doing a small area scroll that stops 20px shy of the bottom of the page.
Ah... this does of course assume the window is small enough to scroll the text.
The background on the squiggle is because it's a png and ie doesn't like them without the javascript I'm yet to put on the page. ;)
posted by twine42 at 6:04 AM on March 26, 2004
In my browsers I have IE doing a full page scroll and Firebird doing a small area scroll that stops 20px shy of the bottom of the page.
Ah... this does of course assume the window is small enough to scroll the text.
The background on the squiggle is because it's a png and ie doesn't like them without the javascript I'm yet to put on the page. ;)
posted by twine42 at 6:04 AM on March 26, 2004
yerfatma - pedantic off-topic point - isn't it better to include a dimension with zero anyway? not all scales have a common zero point (eg temperature) and maybe one day css will be extended to include some strange unit that has an non-zero origin (something logarithmic, for example).
the only advantage i can see to not specifying the units is two bytes of data saved. seems like a decent trade for additional future-proofing.
posted by andrew cooke at 6:06 AM on March 26, 2004
the only advantage i can see to not specifying the units is two bytes of data saved. seems like a decent trade for additional future-proofing.
posted by andrew cooke at 6:06 AM on March 26, 2004
Twine,
Have you tried setting overflow: auto to overflow: scroll? Don't have IE handy but I seem to recall that it doesn' handle auto correctly.
posted by IshmaelGraves at 6:28 AM on March 26, 2004
Have you tried setting overflow: auto to overflow: scroll? Don't have IE handy but I seem to recall that it doesn' handle auto correctly.
posted by IshmaelGraves at 6:28 AM on March 26, 2004
Oh; nevermind; that's not your problem. Your problem is that, because IE blows, with absolute positioning you can set top: and left: or right: and bottom:, but not both. (Can't back this up, it's just from my own observations; what's actually going on may be more complex but that's the behaviour that I've noticed). Try setting a height: 100% on both body and html, and then using a percentage of that for the height of the text box.
posted by IshmaelGraves at 6:33 AM on March 26, 2004
posted by IshmaelGraves at 6:33 AM on March 26, 2004
Response by poster: Ishmael - true, but that kind of ruins the layout. Hmmm... I may have to build two different layouts or give in. Arse.
yerfatma - I agree, however I'm quite anal about my stylesheets and readability, so I tend to leave the px in so that it lines up down the page.
posted by twine42 at 7:06 AM on March 26, 2004
yerfatma - I agree, however I'm quite anal about my stylesheets and readability, so I tend to leave the px in so that it lines up down the page.
posted by twine42 at 7:06 AM on March 26, 2004
OK. Here's your problem (I think). IE does respect overflow: auto but only if you declare the height of the box. add something like this #content {height: 80%; width: auto; overflow: auto; etc.} That fixes the problem fairly well. If don't want double scroll bars at 800x600 resolutions set the height to 75%. I've tested this, it works great.
posted by Grod at 2:42 PM on March 26, 2004
posted by Grod at 2:42 PM on March 26, 2004
If I remember correctly IE5 supported overflow-y and overflow-x, I don't think any other UA does this. You could use a selector hack so visitors useing IE5 can see overflow-y: auto. When the overflow property is set to auto Gecko based browsers only paint a scrollbar for the axis that requires it so if your content needs to scroll vertically but not horizontally, there will only be a vertical scrollbar. IE paints them both even when only one is required. Sigh.
posted by Grod at 2:47 PM on March 26, 2004
posted by Grod at 2:47 PM on March 26, 2004
isn't it better to include a dimension with zero anyway?
You're probably right. However, my anal-retentiveness has bent everyone around me at work to my will and now I can't ignore it. I think it's a result of reading this. Zero is zero is zero and putting a dimension with it doesn't make sense to me personally. It's like testing if something is equal to NULL, y'know?
Who am I to argue with the author of my favorite mailing list?
posted by yerfatma at 7:23 PM on March 26, 2004
You're probably right. However, my anal-retentiveness has bent everyone around me at work to my will and now I can't ignore it. I think it's a result of reading this. Zero is zero is zero and putting a dimension with it doesn't make sense to me personally. It's like testing if something is equal to NULL, y'know?
Who am I to argue with the author of my favorite mailing list?
posted by yerfatma at 7:23 PM on March 26, 2004
This thread is closed to new comments.
Not that it's relevant, but you don't need the "px" when you're setting something to 0 in CSS. 0 is always 0.
posted by yerfatma at 5:05 AM on March 26, 2004