Member Avatar for rangaraj4u

i worked a horizontal menu in my project. when hovering the ling\k the background image will change.the output looks perfect in all browsers even in IE6 except firefox.when hovering the last link a small gap appears.here my code.

CSS :

<.menu_holder {
    width:1000px;
    height:40px;
    background-image:url(../images/menu_normal_govind.jpg);
    background-repeat:repeat-x;

}
.menu {
    margin:0px;
    padding:0px;
}

.menu li {
    list-style-type:none;
    float:left;
    display:block;
    background-image:url(../images/menu_divi_govind.jpg);
    background-repeat:no-repeat;
    background-position:right;
    padding-right:2px;
}
.menu li a {
    padding-left:35px;
    padding-right:35px;
    display:block;
    color:#FFF;
    line-height:39px;
    background-image:url(../images/menu_normal_govind.jpg);
    background-repeat:repeat-x;


}
.menu li a:hover {
    background-image:url(../images/menu_hover_govind.jpg);
    background-repeat:repeat-x;
    padding-left:35px;
    padding-right:35px;
    display:block;
    color:#FFF;
    line-height:39px;
}

HTML :

  <div class="menu_holder">

        <ul class="menu">

            <li> <a href="#">Home</a></li>
            <li> <a href="#">Our Services</a></li>
            <li> <a href="#">Training</a></li>
            <li> <a href="#">HR Interventions</a></li>
            <li> <a href="#">Biodata</a></li>
            <li> <a href="#">Career Development</a></li>
            <li style="background-image:none; padding-right:0px;"> <a href="#" style="padding-left:38px; padding-right:38px; ">Clients</a></li>


         </ul>

  </div>

can anyone tell me the solution?

Edited by TrustyTony because: fixed formatting
  • 2 Contributors
  • 1 Reply
  • 143 Views
  • 11 Hours Discussion Span
  • Latest Post Latest Post by karthik_ppts
Member Avatar for karthik_ppts

try with line-height to 40.
Use code tags to post your code.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.