可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试):

问题:

I know this question had been asked many times.

However, I follow their suggestion :

<center>   <div style="margin : auto; text-align: center">     <a href="#" style="float: left; margin-right: 10px;">Menu Item 1</a>     <a href="#" style="float: left; margin-right: 10px;">Menu Item 2</a>     <a href="#" style="float: left; margin-right: 10px;">Menu Item 3</a>   </div> </center>

alt text http://sites.google.com/site/yanchengcheok/Home/a.png

By using "Center" and "Margin Auto", "Text Align Center" ... I still unable to center the menu item.

回答1:

use inline-block instead of float left.

<center>   <div style="margin : auto; text-align: center">     <a href="#" style="display: -moz-inline-box; display: inline-block; left; margin-right: 10px;">Menu Item 1</a>     <a href="#" style="display: -moz-inline-box; display: inline-block; margin-right: 10px;">Menu Item 2</a>     <a href="#" style="display: -moz-inline-box; display: inline-block; margin-right: 10px;">Menu Item 3</a>   </div> </center>

回答2:

Why not use an unordered list? After all, you are creating a list of links.

<ul>  <li><a href="#">Menu Item 1</a></li>  <li><a href="#">Menu Item 2</a></li>  <li><a href="#">Menu Item 3</a></li> </ul>  li {   display: inline; }  ul {   width: 50%;   margin: 0 auto; }

回答3:

Your code works fine, but the div is 100% wide by default so you won't notice any centering.

Either give the div a width (fixed in pixels or relative in percent) or, if you just want to center the menu items, give the div a text-align setting:

<div style="margin : auto; text-align: center">

回答4:

Work for me (not used float, only text-align): http://jsfiddle.net/vnAvk/20/

<div class="a">     <p>A div Hello</p>     <p class="center">         <a class="b">B Div hello</a>         <a class="c">C Div Hello</a>         <a class="d">D div Hello</a>         <a class="e">E div Hello</a>     </p> </div>  div.a { border: 1px solid red;}  p.center { text-align: center; }  a.b { border: 2px solid blue; }  a.c { border: 2px solid green; }  a.d { border: 2px solid black; }  a.e { border: 2px solid yellow; }

文章来源: Use Margin Auto and Center to center Float Left Div

标签

margin