Re: CellTable: Unable to combine CSS-selectors
Thank you John, Brian and zakness. All of you were spot on!
I was confusing descendant selectors and multiple selectors. I guess the
reason I was having such a hard time figuring out this one was because the
parent TR had many of the same styles applied. This gave the illusion that
the way I was trying to use the selectors was working in some cases but not
in others.
Removing the space and thus turning it into a multi class selector solved
the problem:
.cellTableFirstColumn.cellTableKeyboardSelectedRowCell {
background-color: fuchsia !important;
}
--
You received this message because you are subscribed to the Google Groups
"Google Web Toolkit" group.
To post to this group, send email to google-web-toolkit@googlegroups.com.
To unsubscribe from this group, send email to
google-web-toolkit+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/google-web-toolkit?hl=en.
Re: CellTable: Unable to combine CSS-selectors
Yeah, with a space its a decendent selector, without the space it's a multiple class selector. Quirksmode is the best place to check browser compatibility with CSS selectors/properties: http://www.quirksmode.org/css/contents.html http://www.quirksmode.org/css/multipleclasses.html http://www.quirksmode.org/css/firstchild.html -- You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group. To post to this group, send email to google-web-toolkit@googlegroups.com. To unsubscribe from this group, send email to google-web-toolkit+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/google-web-toolkit?hl=en.
Re: CellTable: Unable to combine CSS-selectors
Apparently, something like this will work:
.cellTableFirstColumn.cellTableKeyboardSelectedRowCell {
...
}
Note that there's no space between the selectors. I haven't tested it
at all, let alone with CellTable, but The Internet says this works...
except in IE6, of course.
Another suggestion I saw was to do some post processing, searching for
elements with these two styles and adding a third style. In this case,
maybe you could latch on to the events that change keyboard focus for
the cells and manage the extra style there.
-Brian
On Thu, Feb 24, 2011 at 11:57 AM, John LaBanca wrote:
> I think the problem is that cellTableFirstColumn
> and cellTableKeyboardSelectedRowCell are both applied to the TD element, so
> a descendent selector won't work because cellTableKeyboardSelectedRowCell is
> not on an element beneath an element styled with .cellTableFirstColumn.
> I haven't tried it, but the CSS3 pseudo selector "first-child" might work
> here (for browsers that support it):
> .cellTableKeyboardSelectedRowCell:first-child {
> background-color: fuchsia !important;
> }
> Thanks,
> John LaBanca
> jlaba...@google.com
>
>
> On Thu, Feb 24, 2011 at 10:22 AM, Julian wrote:
>>
>> Hi there
>>
>> I'm trying to combine the cellTableFirstColumn
>> and cellTableKeyboardSelectedRowCell selectors to set background-color of
>> the first cell in the selected row to a lovely pink.
>>
>> I have the following in my CellTablePatch.css
>>
>> .cellTableFirstColumn .cellTableKeyboardSelectedRowCell {
>> background-color: fuchsia !important;
>> }
>>
>> But for some this style isn't applied. Firebug tells me both of the styles
>> are applied to the first cell in the selected row, but no pink shows up.
>>
>>
>> Combining two other selectors in the same way, e.g. cellTableEvenRow and
>> cellTableFirstColumn works just fine.
>>
>> Any clues to what I'm doing wrong here?
>>
>> --
>> You received this message because you are subscribed to the Google Groups
>> "Google Web Toolkit" group.
>> To post to this group, send email to google-web-toolkit@googlegroups.com.
>> To unsubscribe from this group, send email to
>> google-web-toolkit+unsubscr...@googlegroups.com.
>> For more options, visit this group at
>> http://groups.google.com/group/google-web-toolkit?hl=en.
>
> --
> You received this message because you are subscribed to the Google Groups
> "Google Web Toolkit" group.
> To post to this group, send email to google-web-toolkit@googlegroups.com.
> To unsubscribe from this group, send email to
> google-web-toolkit+unsubscr...@googlegroups.com.
> For more options, visit this group at
> http://groups.google.com/group/google-web-toolkit?hl=en.
>
--
You received this message because you are subscribed to the Google Groups
"Google Web Toolkit" group.
To post to this group, send email to google-web-toolkit@googlegroups.com.
To unsubscribe from this group, send email to
google-web-toolkit+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/google-web-toolkit?hl=en.
Re: CellTable: Unable to combine CSS-selectors
I think the problem is that cellTableFirstColumn and
cellTableKeyboardSelectedRowCell are both applied to the TD element, so a
descendent selector won't work because cellTableKeyboardSelectedRowCell is
not on an element *beneath* an element styled with .cellTableFirstColumn.
I haven't tried it, but the CSS3 pseudo selector "first-child" might work
here (for browsers that support it):
.cellTableKeyboardSelectedRowCell:first-child {
background-color: fuchsia !important;
}
Thanks,
John LaBanca
jlaba...@google.com
On Thu, Feb 24, 2011 at 10:22 AM, Julian wrote:
> Hi there
>
> I'm trying to combine the cellTableFirstColumn and
> cellTableKeyboardSelectedRowCell
> selectors to set background-color of the first cell in the selected row to
> a lovely pink.
>
> I have the following in my *CellTablePatch.css*
>
> .cellTableFirstColumn .cellTableKeyboardSelectedRowCell {
> background-color: fuchsia !important;
> }
>
> But for some this style isn't applied. Firebug tells me both of the styles
> are applied to the first cell in the selected row, but no pink shows up.
>
>
> Combining two other selectors in the same way, e.g. cellTableEvenRow and
> cellTableFirstColumn works just fine.
>
> Any clues to what I'm doing wrong here?
>
> --
> You received this message because you are subscribed to the Google Groups
> "Google Web Toolkit" group.
> To post to this group, send email to google-web-toolkit@googlegroups.com.
> To unsubscribe from this group, send email to
> google-web-toolkit+unsubscr...@googlegroups.com.
> For more options, visit this group at
> http://groups.google.com/group/google-web-toolkit?hl=en.
>
--
You received this message because you are subscribed to the Google Groups
"Google Web Toolkit" group.
To post to this group, send email to google-web-toolkit@googlegroups.com.
To unsubscribe from this group, send email to
google-web-toolkit+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/google-web-toolkit?hl=en.
CellTable: Unable to combine CSS-selectors
Hi there
I'm trying to combine the cellTableFirstColumn and
cellTableKeyboardSelectedRowCell
selectors to set background-color of the first cell in the selected row to a
lovely pink.
I have the following in my *CellTablePatch.css*
.cellTableFirstColumn .cellTableKeyboardSelectedRowCell {
background-color: fuchsia !important;
}
But for some this style isn't applied. Firebug tells me both of the styles
are applied to the first cell in the selected row, but no pink shows up.
Combining two other selectors in the same way, e.g. cellTableEvenRow and
cellTableFirstColumn works just fine.
Any clues to what I'm doing wrong here?
--
You received this message because you are subscribed to the Google Groups
"Google Web Toolkit" group.
To post to this group, send email to google-web-toolkit@googlegroups.com.
To unsubscribe from this group, send email to
google-web-toolkit+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/google-web-toolkit?hl=en.
