Google Groups no longer supports new Usenet posts or subscriptions. Historical content remains viewable.
Dismiss

Class selector question.

0 views
Skip to first unread message

Jongfu Fang

unread,
Nov 14, 2003, 1:58:36 PM11/14/03
to
I'm trying to create a style for create a tab control, but it seems like my
class aren't working properly. :(
here is the clases I'm creating.

.Tab_Select { width:150px}
.Tab_Select.LeftImage {background-image:url(SelectedLeft.gif)}
.Tab_Select.BodyImage {background-image:url(SelectedBody.gif)}

.Tab_Unselect {width:150px}
.Tab_UnSelect.LeftImage {background-image:url(UnSelectedLeft.gif)}
.Tab_UnSelect.BodyImage {background-image:url(UnSelectedBody.gif)}

For some reason. IE is ignoring the parent class and thinks that I'm define
a LeftImage class and a BodyImage class instead.
So when I change:

<table class='Tab_Select">
<tr>
<td class="LeftImage"></td>
<td class="BodyImage"></td>
</tr>
</table>

<table class='Tab_UnSelect">
<tr>
<td class="LeftImage"></td>
<td class="BodyImage"></td>
</tr>
</table>


The images inside the table doesn't change. :(

Further experimentation showed that ID recognizes only the first set of the
.LeftImage and .BodyImage that was declared.

Am I doing something wrong here? or is IE miss behaving?

-John


Alexey V.Zelenin

unread,
Dec 5, 2003, 9:23:13 AM12/5/03
to
Jongfu Fang wrote:

> I'm trying to create a style for create a tab control, but it seems like my
> class aren't working properly. :(
> here is the clases I'm creating.
>
> .Tab_Select { width:150px}
> .Tab_Select.LeftImage {background-image:url(SelectedLeft.gif)}
> .Tab_Select.BodyImage {background-image:url(SelectedBody.gif)}

So maybe it's better to use

.Tab_Select { width:150px}
.Tab_Select .LeftImage {background-color:red}
.Tab_Select .BodyImage {background-color:blue}

.Tab_Unselect {width:150px}
.Tab_UnSelect .LeftImage {background-color:yellow}
.Tab_UnSelect .BodyImage {background-color:green}

instead of your code? you should insert spaces between classnames

>
> .Tab_Unselect {width:150px}
> .Tab_UnSelect.LeftImage {background-image:url(UnSelectedLeft.gif)}
> .Tab_UnSelect.BodyImage {background-image:url(UnSelectedBody.gif)}
>
> For some reason. IE is ignoring the parent class and thinks that I'm define
> a LeftImage class and a BodyImage class instead.
> So when I change:
>
> <table class='Tab_Select">

Second - please use two " or ' sybmols, so it should be <table
class="Tab_Select"> or <table class='Tab_Select'>


Here is whole page i used:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<style>
.Tab_Select { width:150px}
.Tab_Select .LeftImage {background-color:red}
.Tab_Select .BodyImage {background-color:blue}

.Tab_Unselect {width:150px}
.Tab_UnSelect .LeftImage {background-color: yellow}
.Tab_UnSelect .BodyImage {background-color:green}

</style>
</HEAD>

<BODY>

<table class="Tab_Select">
<tr>
<td class="LeftImage">For some reason.</td>
<td class="BodyImage">For some reason.</td>
</tr>
</table>

<table class="Tab_UnSelect">
<tr>
<td class="LeftImage">For some reason.</td>
<td class="BodyImage">For some reason.</td>
</tr>
</table>
</BODY>
</HTML>


0 new messages