WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Fix highlight in navigation menu (3 posts)

  1. animeshtripathi
    Member
    Posted 2 years ago #

    Hi,

    I'm using CSS to highlight a menu button on hover. Pretty simple. But it isn't highlighting the entire button. Some part on the left is left out. Here's the website.

    The CSS I'm using:

    #navigation > ul > li > a:hover {
    background: url('images/nav-active.png') repeat-x top left;
    padding-left: 10px;
    height: 41px;
    line-height: 41px;
    text-decoration: none;
    }

    Can you tell me what is the problem here? I'm sure it's an easy fix, but I can't get it.

    Thanks!

  2. alchymyth
    Forum Moderator
    Posted 2 years ago #

    there is a 10px left padding on this style; change it to:

    #navigation li + li {padding-left: 4px;}

  3. animeshtripathi
    Member
    Posted 2 years ago #

    Thanks! Never looked into the li+li part, I had a li+li style set for the separators, editing the padding-left on that and removing the 10px padding in the a:hover worked fine :)

    Thankyou for helping me for the 3rd time, alchymyth! Owe you one. (three).

    btw, I posted two more issues on this forum, could you check those as well, please?

Topic Closed

This topic has been closed to new replies.

About this Topic