Question

I have this problem in css where i have two different states in css for example

#koolbutton .active {

   color: #fff

}

#koolbutton{

  color: #ccc   //not active

}

When i try this html

<button id ="koolbutton" class="active"> 

It gives me the the normal grey koolbutton not the active one which is white! thanks

Answer 1

You need to omit the space between #koolbutton and .active.

#koolbutton { /*not active*/ }
#koolbutton.active { /*active*/ }