Я работаю над старой страницей Wordpress, созданной с помощью темы myMag, и я после центрирования меню, чтобы заполнить все пространство меню, у меня проблемы с выпадающим меню. Я новичок в CSS и, может быть, вы могли бы сказать, где я ошибся?после выпадающего меню в центре выпадающего меню
меню перед:
меню после того, как:
проверки выпадающий элемент показывает это:
<ul class='children'>
<li class="page_item page-item-187"><a href="http://xxx" title="Progetti di formazione">Progetti di formazione</a></li>
<li class="page_item page-item-183"><a href="http://xxx" title="Progetti di mobilità">Progetti di mobilità</a></li>
<li class="page_item page-item-185"><a href="http://XXX/" title="Progetti pilota">Progetti pilota</a></li>
<li class="page_item page-item-168"><a href="http://xxx" title="Ricerche e studi">Ricerche e studi</a></li>
</ul>
CSS-код выглядит следующим образом:
#navcontainer #navbar {
float:left;
height: 51px;
line-height:50px;
margin-left: -15px;
margin-top: 1px;
}
#navbar, #navbar ul {
margin:0;
padding:0;
width:900px;
list-style-type:none;
display: table;
position:relative;
line-height:50px;
z-index:5;
}
#navcontainer #navbar a {
height: 40px;
display:block;
padding:0 21px;
text-decoration:none;
text-align:center;
line-height:28px;
outline:none;
float: left;
z-index:35;
position:relative;
color: #FFF;
text-shadow:1px 1px 0 #515151;
font-weight: bold;
vertical-align: middle;
}
#navcontainer #navbar a:hover {
color: #CCC;
}
#navcontainer #navbar ul a {
line-height: 30px;
}
#navcontainer #navbar li {
z-index:20;
text-align: center;
display: table-cell;
font-size: 13px;
vertical-align: bottom;
}
#navcontainer #navbar li li {
border-left:none;
margin-top:0;
}
#navcontainer #navbar ul {
position:absolute;
display:none;
width:172px;
top:38px;
left:-1px;
background: #f5f5f5;
}
#navcontainer #navbar li ul a {
width:130px;
height:auto;
float:left;
text-align:left;
padding:0 21px;
color: #606060;
text-shadow: none;
}
#navcontainer #navbar ul ul {
top:auto;
}
#navcontainer #navbar li ul ul {
left:172px;
top: 0px;
}
#navcontainer #navbar li ul ul a {
border-left:1px solid #CCC;
}
#navcontainer #navbar ul {
border-top:none;
}
#navcontainer #navbar ul a, #navcontainer #navbar ul li {
background-color:#e7e7e7;
}
#navcontainer #navbar ul a:hover, #navcontainer #navbar ul a:focus {
color: #18649a;
}
#navcontainer #navbar li:hover ul ul, #navcontainer #navbar li:hover ul ul ul,#navcontainer #navbar li:hover ul ul ul ul {
display:none;
}
#navcontainer #navbar li:hover ul, #navcontainer #navbar li li:hover ul, #navcontainer #navbar li li li:hover ul, #navcontainer #navbar li li li li:hover ul {
display:block;
}
и PHP-файл, который создает это меню выглядит следующим образом:
<div id="navcontainer">
<div class="navigation">
<div class="wrapper">
<ul id="navbar">
<?php $exclude = $myOptions['pages_excl'];?>
<?php if(!$myOptions['pages_limit']) {
$limit = '10'; } else {
$limit = $myOptions['pages_limit'];
}
if($myOptions['pages_limit'] == '0') {
$limit = 0;
}
?>
<li><a href="<?php echo get_settings('home'); ?>">Home</a></li>
<?php wp_list_pages("exclude=$exclude&title_li=&depth=3&number=$limit");?>
</ul>
</div>
</div>
</div>
Вы могли бы предоставить jsfiddle? – FKutsche
К сожалению, причина выглядит так, что выпадающий файл создается темой WP, и я даже не могу получить PHP-код, который его создает. – user3641915
вам нужно больше HTML, у вас есть раскрывающаяся часть, но не родительские элементы. – David