15 replies [Last post]
airswit
airswit's picture
Offline
Enthusiast
California
Last seen: 9 years 8 weeks ago
California
Timezone: GMT-7
Joined: 2006-01-07
Posts: 124
Points: 9

hey everybody. I am having a slight problem in IE...again. if you check out http://tswitkowski.selfip.biz/courses.php and look at the rounded boxes on the right hand side. in IE, the ones that are colored 'blue', the color of the rounding <b> elements is wrong. it works in FF, but not IE. check out the style sheet at http://tswitkowski.selfip.biz/lib/js/boxes.css

this is a slight problem, and one i can live with if i need to, but obviously I would like to iron this out.
any suggestions?

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 6 years 1 week ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

class selectors not working in IE

Look the same in FF & IE to me.

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

airswit
airswit's picture
Offline
Enthusiast
California
Last seen: 9 years 8 weeks ago
California
Timezone: GMT-7
Joined: 2006-01-07
Posts: 124
Points: 9

class selectors not working in IE

at the very bottom...that is the <div class="box round blue nofooter"> box

p.s. it is in IE 6.0.29....

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 6 years 1 week ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

class selectors not working in IE

airswit wrote:
p.s. it is in IE 6.0.29....

Yeah, like I said: it's also in FF 1.5, so it's not an IE-only bug so it's probably a wrong colour specified somewhere.

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

airswit
airswit's picture
Offline
Enthusiast
California
Last seen: 9 years 8 weeks ago
California
Timezone: GMT-7
Joined: 2006-01-07
Posts: 124
Points: 9

class selectors not working in IE

I see them differently [using the IE specified and FF 1.5]...

drhowarddrfine
Offline
Leader
Last seen: 10 years 46 weeks ago
Timezone: GMT-6
Joined: 2005-05-21
Posts: 764
Points: 0

class selectors not working in IE

Errors
URI : http://tswitkowski.selfip.biz/lib/js/boxes.css

* Line: 14 Context : .xtop, .xbottom

Invalid number : color transparent is not a color value : transparent
* Line: 95 Context : div.box.round

Lexical error at line 98, column 0. Encountered: <EOF> after : ""

URI : http://tswitkowski.selfip.biz/lib/js/hknstyle.css

* Line: 3 Context : html

Invalid number : border orange is not a color value : 1px dashed orange
* Line: 103 Context : div.pic

Invalid number : padding auto is not a padding-right value : 5em auto

IE7 is 10 years behind the standards or wrong.
But it works in IE!
IE is a cancer on the web -- Paul Thurott

airswit
airswit's picture
Offline
Enthusiast
California
Last seen: 9 years 8 weeks ago
California
Timezone: GMT-7
Joined: 2006-01-07
Posts: 124
Points: 9

class selectors not working in IE

sheesh, can't believe i forgot to validate. anyway, its valid now, still same problem

I will be working through any warning possibilities, but does anybody have any suggestions in the meantime?

Chris..S
Chris..S's picture
Offline
Moderator
Last seen: 8 years 4 weeks ago
Timezone: GMT+1
Joined: 2005-02-22
Posts: 6078
Points: 173

class selectors not working in IE

I see the same thing as your images in both FF and IE. The border colours are exactly as specified in your style sheet.

In FF, use Web Developer/CSS/View Style Information. Hover over the border and click to see what style rules are being used.

airswit
airswit's picture
Offline
Enthusiast
California
Last seen: 9 years 8 weeks ago
California
Timezone: GMT-7
Joined: 2006-01-07
Posts: 124
Points: 9

class selectors not working in IE

its not the border that is the proble, it is that little thin line above the bottom border (this is is the background-color on the b elements)

as expected, when using web developer's style viewer, the two different colored boxes give different background-colors:

this one never had a problem:

div.box.round.red.nofooter .xbottom .xb1, div.box.round.red.nofooter .xbottom .xb2, div.box.round.red.nofooter .xbottom .xb3, div.box.round.red.nofooter .xbottom .xb4    (line 86)
{
    background-color: rgb(51, 153, 255);
    background-image: none;
    background-repeat: repeat;
    background-attachment: scroll;
    -x-background-x-position: 0%;
    -x-background-y-position: 0%;
    -moz-background-clip: -moz-initial;
    -moz-background-origin: -moz-initial;
    -moz-background-inline-policy: -moz-initial;
}

this one is the one in the pictures...the background colors defined here are correct, but in IE, they show the above color

div.box.round.blue.nofooter .xbottom .xb1, div.box.round.blue.nofooter .xbottom .xb2, div.box.round.blue.nofooter .xbottom .xb3, div.box.round.blue.nofooter .xbottom .xb4    (line 67)
{
    background-color: rgb(102, 153, 255);
    background-image: none;
    background-repeat: repeat;
    background-attachment: scroll;
    -x-background-x-position: 0%;
    -x-background-y-position: 0%;
    -moz-background-clip: -moz-initial;
    -moz-background-origin: -moz-initial;
    -moz-background-inline-policy: -moz-initial;
}

the styling showed by firefox is dead on correct, but in IE, again, the 2nd listing i showed above, i am guessing, does not get applied. either that, or both sets get applied, since the 'red' coloring is below the 'blue' coloring

p.s. I flipped the definitions for the 2 colors ('red' and 'blue'), and the problem flipped as well

discarded
Offline
newbie
Last seen: 14 years 38 weeks ago
Joined: 2006-01-31
Posts: 2
Points: 0

IE only understands one class at a time

div.box.round.red.nofooter .xbottom .xb1, div.box.round.red.nofooter .xbottom .xb2, div.box.round.red.nofooter .xbottom .xb3, div.box.round.red.nofooter .xbottom .xb4

Is the same as
div.nofooter .xbottom .xb1, div.nofooter .xbottom .xb2, div.nofooter .xbottom .xb3, div.nofooter .xbottom .xb4

i.e. To Internet Explorer div.box.round.red.nofooter is the same as div.box.round.blue.nofooter.

That's why swapping the order of the rules swapped the presentation.

airswit
airswit's picture
Offline
Enthusiast
California
Last seen: 9 years 8 weeks ago
California
Timezone: GMT-7
Joined: 2006-01-07
Posts: 124
Points: 9

class selectors not working in IE

i don't get why that would be true, since it distinguishes between div.box.blue and div.box red

discarded
Offline
newbie
Last seen: 14 years 38 weeks ago
Joined: 2006-01-31
Posts: 2
Points: 0

class selectors not working in IE

It's a bug.

See Section B bug 7 of this catologue of bugs
http//www.richinstyle.com/bugs/ie5demo.html

(applies to IE5 and 6)

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 31 weeks 16 hours ago
Joined: 2004-06-30
Posts: 9668
Points: 801

class selectors not working in IE

Not too keen on this bug:

Bug 4: Style specificity

BODY P#twenty {color: red}
<P style="color: blue">

This element should be red since style's specificity is 100, but it will be blue in IE 5. 

Surely the inline style is bound to override the css?

Verschwindende wrote:
  • CSS doesn't make pies

Chris..S
Chris..S's picture
Offline
Moderator
Last seen: 8 years 4 weeks ago
Timezone: GMT+1
Joined: 2005-02-22
Posts: 6078
Points: 173

class selectors not working in IE

I'm not to keen on a lot of what it says. I thinks it best to ignore that page, the author seems to be working to his/her own understanding of CSS not any accepted understanding.

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 5 years 41 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

class selectors not working in IE

Well it's clearly not an accurate understanding of how to count the weight of selectors, I also find it hard to take seriously someone instructing on CSS when the page seems broken in both FF and IE!

Lets not post that link again Smile

Hugo.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

airswit
airswit's picture
Offline
Enthusiast
California
Last seen: 9 years 8 weeks ago
California
Timezone: GMT-7
Joined: 2006-01-07
Posts: 124
Points: 9

class selectors not working in IE

so does anybody have any clue what could remedy my problem, or am i just gonna have to live with it?