【发布时间】：2012-08-17 04:58:26
【问题描述】：
我希望有一个简单的 CSS 修复。问题很简单，我正在制作一个自定义 wordpress 主题并且我正在使用一些自定义菜单，代码工作正常，但是我制作了一个带有分隔符的内联菜单 css 样式（由左边框：1px 等制成，查看 css。）并且有一个显示错误。
当它是默认的 wordpress 菜单（wordpress 页面列表）时，菜单显示良好，但是当我使用 wordpress 管理面板中的菜单编辑器插入自定义链接时，分隔符被某种空间推动！
查看jsFiddle illustrating the problem生成的html
functions.php
register_nav_menus(
array( 'header-menu' => __( 'Header Menu' ), 'footer-menu' => __( 'Footer Menu' ))
);
页脚.php
<div id="last-footer">
<div id="last-footer-container" class="container_12">
<div id="last-footer-menu" class="grid_12" align="center">
<?php
wp_nav_menu( array( 'theme_location' => 'footer-menu' ) );
?>
</div>
<div class="clear"></div>
<!-- other stuff here (widgets) -->
</div><!-- #last-footer-container end -->
style.css（使用 lesscss 生成：P）
#last-footer {
background:#222;
color:white;
}
#last-footer-container {
padding-bottom:10px;
padding-top:10px;
}
#last-footer-container a { color:#a62e0d; }
#last-footer-container a:hover {
text-decoration:none;
color:#602000;
text-shadow:1px 1px 1px black;
}
#last-footer-container span { float:left; }
#last-footer-menu ul {
margin:0;
padding:0;
}
#last-footer-menu ul li {
border-left:1px solid #121212;
border-right:1px solid #323232;
display:inline;
padding-left:10px;
padding-right:10px;
margin:0;
}
#last-footer-menu ul li:first-child { border-left:none; }
#last-footer-menu ul li:last-child { border-right:none; }
【问题讨论】：
-
注意：删除
<li>标签之间的结束线将解决显示问题，但由于html是由wordpress生成的，这不是一个有价值的修复。