|
| |
|
|
djcc
Posts: 26
Joined: 9/3/2003
From: Chicago 'burbs
Status: offline
 |
IE6 - same id with different classes not working. - 9/16/2007 18:13:13
Code:
#content {
margin: 0; }
#LeftSide,
#RightSide {
margin: 3px 8px;}
/* only the first one works */
#LeftSide.3bss {
margin: 3px 0px 3px 8px!important;}
#LeftSide.3ssb {
margin: 3px 0px 3px 8px!important;}
/* same problem */
#content.3bss {
margin: 3px 0 3px 8px !important;}
#content.3ssb {
margin: 3px 8px 3px 0 !important;}
Classic sidebar content structure. Options exist to place sidebars on right or left. In my case, I need to adjust margins based on these combinations.
As you can see, margins are initially set to default values. #LeftSide.3bss margins work - definitely override the defaults. The second version - #LeftSide.3ssb does NOT work... at least, not as long as #LeftSide.3bss exists. If I comment that one out, then #LeftSide.3bss will work. Same for the 2 #content versions. Only seems to interpret the first instance of an id/class combination and will not allow any further combinations using the same id with a different class. Anyone have a solution, or am I doing something wrong here?
< Message edited by djcc -- 9/16/2007 18:33:01 >
|
|
|
|
djcc
Posts: 26
Joined: 9/3/2003
From: Chicago 'burbs
Status: offline
|
RE: IE6 - same id with different classes not working. - 9/16/2007 19:38:23
Thank you Donkey - sorry about the missing html. I'm not talking about children. Containers would be
<div id="LeftSide class="2bss> or <div id=LeftSide class="2ssb">
<div id="content" class="2bss"> or <div id="content" class="2ssb">
| |
|
|
|
Tailslide
Posts: 5948
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline
|
RE: IE6 - same id with different classes not working. - 9/17/2007 2:41:13
Why do you have 2 different classes to do the same thing?
#LeftSide.3bss and #LeftSide.3ssb have exactly the same rules? While you can only use an id once on a page, you're free to reuse classes however many times so it's a good idea not to have new rules that do the same thing - too confusing. Plus it's usually better to give the classes a more meaningful name.
Several points:
1. Why don't you just apply these new rules to the div rules themselves (#LeftSide) rather than adding classes? Much less confusing and much less code.
2. Do you have a proper DOCTYPE on your page as this will throw IE into Quirks mode and can cause issues.
3. If you can't apply the rules for some reason to the divs themselves and have to have classes then just have the single class - don't add more for no reason.
4. Why have you got !important in there so much - I never use that (not that it's incorrect - it's just usually unecessary).
5. Do you have any inline rules that are overriding the stylesheet?
6. Can we see a link - much easier to diagnose problems than with snippets of code.
| |
|
|
|
djcc
Posts: 26
Joined: 9/3/2003
From: Chicago 'burbs
Status: offline
|
RE: IE6 - same id with different classes not working. - 9/17/2007 10:57:19
Doing a little more digging, I discovered this is indeed an ie6 bug. IE6 understands the first instance of #id.class but ignores all subsequent combinations using the same id. Same goes for class.class - accepts the first, ignores the rest. Seems related to the ie6 bug that only recognizes the last class listed when multiple classes are provided, eg .class1.class2.class3 {rules} is seen by ie6 as simply .class3{rules}
| |
|
|
|
Tailslide
Posts: 5948
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline
|
RE: IE6 - same id with different classes not working. - 9/17/2007 11:16:01
That IE class bug was fairly old if I remember rightly - pre version 5... What IE 6 can't do is understand chained classes e.g: ul.red.itallic
but you weren't using them in the styles you posted.
Could you post a link to the page itself - then we can probably help you fix it a bit easier.
_____________________________
"My strategy is so simple an idiot could have devised it"
Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project
| |
|
 New Messages |
 No New Messages |
 Hot Topic w/ New Messages |
 Hot Topic w/o New Messages |
 Locked w/ New Messages |
 Locked w/o New Messages |
|
Post New Thread
Reply to Message
Post New Poll
Submit Vote
Delete My Own Post
Delete My Own Thread
Rate Posts
|
|
|
Printable Version 
