Sorry for the delay, I had tried and couldn't solve it. I suggest doing away with the menu and using the much easier code below. The menu currently used in Atahualpa is one of the hardest pieces of CSS ever, I will replace it with the code below in one of the next versions.
Add this at Style & Edit Header Area -> Configure Header Area
PHP Code:
<div id="hormenu" class="clearfix">
<ul id="nav">
<?php wp_list_pages('title_li='); ?>
</ul>
</div>
and remove
%pages from there
For more
wp_list_pages parameters see
http://codex.wordpress.org/Template_Tags/wp_list_pages
Add CSS as CSS Insert:
div#hormenu {
background: #666666; /* menu bar background */
}
ul#nav, ul#nav ul {
float: left;
list-style: none;
line-height: 1;
padding: 0;
margin: 0;
}
ul#nav li a {
display: block;
text-decoration: none;
}
ul#nav li {
float: left;
padding: 0;
}
ul#nav ul {
position: absolute;
left: -999em;
height: auto;
width: 150px; /* width of submenus */
}
ul#nav ul ul {
margin-left: 149px; /* same as width of submenus, or -1px if you have borders, to avoid 2 x 1px borders side by side adding up to a 2 px border */
margin-top: -28px; /* adjust to move submenus up/down a bit so the submenu's top border lines up with the parent LI's top border */
}
ul#nav ul li {
width: 100%;
}
ul#nav ul li a {
width: auto;
}
ul#nav li a {
color:#ffffff;
padding: 4px 5px;
background: #666666; /* tab background */
font-weight: bold;
}
ul#nav li a:hover,
ul#nav li.current_page_item a {
background: #E68B04; /* tab hover and current background */
color: #000000;
}
/* Hide/show submenus */
ul#nav li:hover ul ul,
ul#nav li:hover ul ul ul,
ul#nav li.sfhover ul ul,
ul#nav li.sfhover ul ul ul {
left: -999em;
}
ul#nav li:hover ul,
ul#nav li li:hover ul,
ul#nav li li li:hover ul,
ul#nav li.sfhover ul,
ul#nav li li.sfhover ul,
ul#nav li li li.sfhover ul {
left: auto;
}
»
WordPress Themes »
Atahualpa 3 Wordpress theme »
Page & Category Menu Bars »
Mouseover (Hover) Page Menubar CSS problem IE8
