Solved

CSS hover not working...

Posted on 2014-07-26
4
261 Views
Last Modified: 2014-07-26
When I change the css to:
#btn1      <-- remving :hover
{
.
.
}

I can see the effect of hover setting. But with the followings, it doesn't work:
#btn1: hover    
{
.
.
}
.btns: hover      <-- after adding class="btns" to the controls
{
.
.
}

Question: How can I make the hover work?

Thank you.

#btn1: hover
{
  background: #7bb9e0;
  background-image: -webkit-linear-gradient(top, #7bb9e0, #4fa5db);
  background-image: -moz-linear-gradient(top, #7bb9e0, #4fa5db);
  background-image: -ms-linear-gradient(top, #7bb9e0, #4fa5db);
  background-image: -o-linear-gradient(top, #7bb9e0, #4fa5db);
  background-image: linear-gradient(to bottom, #7bb9e0, #4fa5db);
  text-decoration: none;
}

Open in new window

0
Comment
Question by:Mike Eghtebas
  • 2
  • 2
4 Comments
 
LVL 58

Expert Comment

by:Gary
Comment Utility
No space between the : and the hover

#btn1:hover
0
 
LVL 33

Author Comment

by:Mike Eghtebas
Comment Utility
Thanks.

#btn1:hover works.

because I have multiple buttons,
#btn1, #btn2:hover    doesn't work.

do I have to add hove to each on of them?

#btn1:hover, #btn2:hover  

I tried:
.btns:hover but it didn't work.

MIke
0
 
LVL 58

Accepted Solution

by:
Gary earned 500 total points
Comment Utility
Yes you need to add it to each one as they are seperate classes

#btn1:hover, #btn2:hover
0
 
LVL 33

Author Comment

by:Mike Eghtebas
Comment Utility
Thanks Gary. There is also another question at:
http://www.experts-exchange.com/Programming/Languages/C_Sharp/Q_28484516.html

If you couple of minutes to take a look at.

Mike
0

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
Not sure what the best email signature size is? Are you worried about email signature image size? Follow this best practice guide.
In this Micro Tutorial viewers will learn how to create a CSS image sprite (In a later tutorial, viewers will learn how to use CSS and HTML to create a navigation menu using this sprite) Open a new Photoshop document with a width of (Icon width)x(N…
In this tutorial viewers will learn how to embed custom externally-hosted Google Fonts using the Google Font API in CSS Go to the Google Fonts website at google.com/fonts: Browse or search based on font properties or name to find a suitable font for…

762 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

8 Experts available now in Live!

Get 1:1 Help Now