PDA

View Full Version : IE 6 and Siblings



Fizzy
01-10-2006, 04:09 AM
Hi,

Having problems with IE6 and the following:

Div#text p+p {.......}

Is this not supported in IE? it seems fine in FF.

Does anyone have another suggestion...I just want to pick the 2nd then 3rd, 4th.... <p> in a specified <div> and position each absolute.

I am new to CSS so I am sure there is a better way that what I am using.

Thx

jscheuer1
01-10-2006, 09:12 AM
IE6 simply appears not to understand what that means, a similar effect can be achieved using the Descendent Selector:


div p {
color:red;
}

. . . with a twist. First consider that if you have a division with the id of 'text', it can be selected simply by its id. A Descendent can be used to select the targeted paragraphs, which themselves will be Descendent of the Descendent Selector (this requires an additional element in your markup though):


#text div p {
color:red;
}

The above rule will select all but the first paragraph in the element with the id of text if the markup looks like so:


<div id="text">
<p>Hi</p>
<div>
<p>there</p><p>folks</p>
</div></div>

Twey
01-10-2006, 05:15 PM
Many of the more complex CSS selectors aren't supported in IE. As John said, you'll have to use a combination of simpler methods to achieve the same effect. It's not quite as robust, but it's the only choice if you want IE to be able to see the effects you apply.

mwinter
01-10-2006, 07:53 PM
IE6 simply appears not to understand what [an adjacent selector] meansYes, as I wrote at the end of another post in this forum (http://www.dynamicdrive.com/forums/showpost.php?p=24601&postcount=3).



#text div p {
color:red;
}The above rule will select all but the first paragraph in the element with the id of text if the markup looks like so:


<div id="text">
<p>Hi</p>
<div>
<p>there</p><p>folks</p>
</div></div>An alternative approach, that would work with other structures is:



#text p {
background: transparent;
color: red;
}
#text p.first {
color: black;
}


<div id="text">
<p class="first">This will be black.</p>
<p>This will be red.</p>
<p>So will this.</p>
</div>
The color property in the second, more specific rule, would override the same declaration in the first.

Mike