CODEWITHSUNDEEP
css
anmarti
anmarti

Reputation: 5143

Apply CSS stylesheet to all elements but one

I have several grids (kendo grids). This have their common style with their hover effect. I want to prevent this hover effect for only one grid, named mygrid.

Tryed this with no success:

 .k-grid tr:hover :not(#mygrid)
 {
  color:White;
  background-color:#90B5DA;
 }

Upvotes: 2

Views: 1173

Answers (2)

Ryan Wheale
Ryan Wheale

Reputation: 28440

The already suggested use of :not() is correct. For wider support, you may consider doing something like this, where the :hover state of #mygrid is the same as the "off" state:

.k-grid tr,
#mygrid tr:hover /* Add this rule to the "off" state */
{
  color:Grey;
  background-color:#333;
}

.k-grid tr:hover
{
  color:White;
  background-color:#90B5DA;
}

Upvotes: 1

Shmiddty
Shmiddty

Reputation: 13967

The correct usage of not is attached to another selector. For example:

.k-grid:not(#mygrid)

Will select all elements with the class k-grid except if the element has an id of mygrid

So what you want is this:

.k-grid:not(#mygrid) tr:hover

Source: http://www.w3.org/TR/selectors/#negation

Upvotes: 3

Related Questions