我有以下html:
<div id="footer"> <ul id="menu-utility-navigation" class="links clearfix"> <li class="menu-685 menu-site_map first">Site Map </li> <li class="menu-686 menu-privacy_policy">Privacy Policy </li> <li class="menu-687 menu-terms___conditions">Terms & Conditions </li> <li class="menu-688 menu-contact_us last">Contact Us </li> </ul> </div>
使用以下CSS:
div#footer { font-size: 10px; margin: 0 auto; text-align: center; width: 700px; }
我扔在字体大小的位只是为了看风格是否工作(Firebug报告它正在工作,但我想看到)。这是工作。但是文本不是在Firefox或Safari中的页脚中居中(尚未在IE中检查)。
这里是从firebug出来的:
div#footer { font-size: 10px; margin: 0 auto; text-align: center; width: 700px; } Inherited fromdiv#page #skip-to-nav,#page { line-height: 1.5em; } Inherited frombody.html body { color: #666666; font-family: verdana,arial,sans-serif; }
帮帮我?
解决方法
我假设你想要所有的项目彼此相邻,整个事情要水平居中。
li元素是显示:默认情况下阻止占用所有的水平空间。
加
div#footer ul li { display: inline }
一旦你这样做,你可能想要摆脱列表的子弹:
div#footer ul { list-style-type: none; padding: 0px; margin: 0px }