extra white line under li items that have no border

Posted by isabel018 on Stack Overflow See other posts from Stack Overflow or by isabel018
Published on 2012-12-19T16:57:46Z Indexed on 2012/12/19 17:03 UTC
Read the original article Hit count: 250

Filed under:
|
|

I have a problem with extra white lines showing up under my list items. It's not a border as I haven't set any borders, except the one under My Account, it's just to show that the white line is not a border. The one under it is -- a 4px border the same color as the background.

This problem occurred after I had resolved a conflict between my Nivo Slider and the Woocommerce plugin on my WP site. I got both of them to work together, but then this other issue with the list cropped up. Any ideas as to what caused this and how to fix it?

enter image description here

Here's my CSS if that helps:

#header #navigation ul.nav > li.current_page_item > a 
{ color: #D4145A;}
#header #navigation ul.nav > li:hover a {
border-width: 0px 0px 4px;
border-style: none none solid;
border-color: -moz-use-text-color -moz-use-text-color rgb(212, 20, 90);
-moz-border-top-colors: none;
-moz-border-right-colors: none;
-moz-border-bottom-colors: none;
-moz-border-left-colors: none;
border-image: none;
background: none repeat scroll 0% 0% rgb(212, 20, 90);}

and the HTML for it too:

<nav id="navigation" class="col-full parent" role="navigation">
<ul id="main-nav" class="nav fl parent">
<li class="page_item"></li>
<li class="page_item page-item-11"></li>
<li class="page_item page-item-12"></li>
<li class="page_item page-item-13 parent"></li>
<li class="page_item page-item-15 current_page_item parent">
<a href=""></a>
<ul class="children"></ul></li>
</ul>
</nav>

Help please! I'm at my wits' end! Thanks!

© Stack Overflow or respective owner

Related posts about html

Related posts about css