style - controls on page

Hello,
If I have 2 grids on a page and add this to the page header
div.RadGrid td.mergedCell
{
    border-bottom: 1px solid #333;
}

How do I only get this to affect the control RadGrid1 but not RadGrid2?
johnson1Asked:
Who is Participating?
 
Chris StanyonConnect With a Mentor Commented:
Can we see a link to your page?

For my solution to work you must have a unique ID on each of the grids (they are case-sensitive):

id="RadGrid1"
id="RadGrid2"

Double check the source of your page to make sure you have these,
0
 
Tom BeckConnect With a Mentor Commented:
div.RadGrid:nth-of-type(1) td.mergedCell
{
    border-bottom: 1px solid #333;
}

...But it's not supported by IE8 or less.
0
 
Chris StanyonCommented:
if RadGrid1 and RadGrid2 are the IDs of the 2 grids, then use an ID selector, instead of a class selector:

div#RadGrid1 td.mergedCell { border-bottom: 1px solid #333; }

Open in new window

0
 
johnson1Author Commented:
Hello,
I tried both solutions. It still affects both RadGrid1 and RadGrid2.
0
 
johnson1Author Commented:
Thank you.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.