The problem is that IE6 / 7 does not seem to be fully CSS compliant.
If you use your example in Firefox, this works as expected. IE appears to
break the rules over and over again. I could quote you loads of examples of
where IE fails to conform to CSS, here's two ive found in the last few days.
1.) Cannot style Select Option Elements Correctly. Will not allow other
fonts in the list or format borders on list items. Firefox does.
2.) Border precedence on table cells, Fails to observe the reccomendations
of CSS, Firefox works as expected.
So, if in doubt, just check it on Firefox first before you blow your mind
thinking you have coded it incorrectly, its normally is IE that fails in
these instances in my experience. Its a shame, as in many other things I
really like IE, but from a developers point of view it has issues.
For general positioning, I normally develop on Firefox first and then it
usually works in IE, but not the other way around.
Cheers
"Nathan Sokalski" <> wrote in message
news:...
> After a little research, I found that I was correct about the :first-child
> pseudo-class, so I tried the following instead:
>
> td.mystyle *:first-child+span
> OR
> td.mystyle a:first-child+span
>
> Neither of these worked either, but I think I may have found the problem,
> but I don't have IE7 so tell me if this is correct:
>
> I am using IE6, and if I understand several of the websites I looked at,
> IE6 does not support > or :first-child in CSS stylesheets. It did sound,
> however, like IE7 did. Is this correct? This would explain why my attempts
> seemed right (maybe they really aren't, but they at least seemed that way)
> but still didn't work. Am I correct in saying this?
> --
> Nathan Sokalski
>
> http://www.nathansokalski.com/
>
> "Nathan Sokalski" <> wrote in message
> news:...
>>I apologize for asking an ASP.NET newsgroup a question about CSS, but I do
>>not know of any CSS newsgroups. I have a page with many areas that are
>>composed of the following elements in the following layout:
>>
>> <td class="mystyle">
>> <a></a>
>> <span></span>
>> <img/>
>> <span></span>
>> </td>
>>
>> For the td element, I obviously used the following selector:
>>
>> .mystyle{}
>>
>> For the a and img elements, I would have thought I would use
>>
>> td.mystyle>a{}
>> td.mystyle>img{}
>>
>> Since the a and img elements are immediate children of the td element,
>> but this did not seem to work, but the following did:
>>
>> td.mystyle a{}
>> td.mystyle img{}
>>
>> Can someone tell me why the > did not work? This is my first time using
>> the
>> > technique in CSS, so maybe I am doing something wrong.
>>
>> The span elements were a little harder, since there are two of them. I
>> tried the following for the first span:
>>
>> td.PoemRating span:first-child{}
>>
>> This did not work, so I am going to guess that it is because the span is
>> not the first child, only the first child that is a span. Is there a way
>> to take care of the span elements (without giving them a class attribute,
>> if this is the only way, I can accept that)? Thank you for any help that
>> anyone can provide.
>> --
>> Nathan Sokalski
>>
>> http://www.nathansokalski.com/
>>
>
>