[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now


make entire button clickable

Posted on 2014-08-11
Medium Priority
Last Modified: 2014-08-11
How do I make the entire button in the navigation (including icon) clickable?  Currently the only "hot spot" of the navigation is the text.  The navigation was done using sprites.

Question by:nsitedesigns
  • 2
  • 2
LVL 58

Accepted Solution

Gary earned 2000 total points
ID: 40253304
Move the <i></i> inside the anchor tag

In li a {...} change
display:inline-block to display:block
Change the padding to padding-left:15px
Add line-height: 35px;

Remove the padding from li {...}

Author Comment

ID: 40253350
Well, that fixed it so that more of the button is clickable but now the icons are too far down the page.  I tried bumping them up using the negative background position but that didn't seem to help.  Any other ideas?
LVL 58

Expert Comment

ID: 40253354
Follow my comment exactly

Move the <i></i> inside the anchor tag

Author Comment

ID: 40253424
Sorry - my mistake.  Worked like  a charm!

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When it comes to write a Context Sensitive Help (an online help that is obtained from a specific point in state of software to provide help with that state) ,  first we need to make the file that contains all topics, which are given exclusive IDs. …
Originally, this post was published on Monitis Blog, you can check it here . In business circles, we sometimes hear that today is the “age of the customer.” And so it is. Thanks to the enormous advances over the past few years in consumer techno…
Any person in technology especially those working for big companies should at least know about the basics of web accessibility. Believe it or not there are even laws in place that require businesses to provide such means for the disabled and aging p…
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.
Suggested Courses

873 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