CODEWITHSUNDEEP
css
Random Joe
Random Joe

Reputation: 640

Table Row CSS Background Color Won't Change

I have the following CSS:

.tableStatic tbody tr { border-top: 1px solid #e7e7e7; }
.tableStatic tbody tr:nth-child(even) { background-color:#f5f5f5; }

I want to change the background of certain "holiday" rows as follows

.tableStatic tbody tr { border-top: 1px solid #e7e7e7; }
.tableStatic tbody tr:nth-child(even) { background-color:#f5f5f5; }
.tableStatic tbody tr .holiday {background-color: #778899;}

How ever it doesn't work. The background color is changed but it is using #f5f5f5 instead of #778899

Any pointers?

Upvotes: 1

Views: 8855

Answers (3)

Ingemar
Ingemar

Reputation: 1658

try this

.tableStatic tbody tr .holiday {background-color: #778899 !important;}

Upvotes: -1

IsisCode
IsisCode

Reputation: 2490

Is there an element in the table row with a class 'holiday'? Because that's what your last CSS rule does.

If you want to style the actual table rows which have a class of 'holiday' you must simply remove one space.

.tableStatic tbody tr.holiday {background-color: #778899;}

Notice there is no space between 'tr' and '.holiday'

Upvotes: 1

Ry-
Ry-

Reputation: 224913

You have a space there:

.tableStatic tbody tr .holiday {background-color: #778899;}

Remove it and it should work.

.tableStatic tbody tr.holiday {background-color: #778899;}

Upvotes: 2

Related Questions