Html 中心截面是否设置为内联块？

我有一个定义如下的部分：

<footer>
    <section id="content">
        <section id="footer-links" class="center">
            <a href="index.php" class="float-left">Home</a>
            <a href="about.html" class="float-left">About</a>
            <a href="contact.html" class="float-left">Contact</a>
            <a href="terms.html" class="float-left">Terms and Conditions</a>
        </section>
    </section>
</footer>

章节（#内容） 节（#页脚链接） A.

---

但是，正如您所看到的，它将

部分左对齐。希望你们都能帮忙
 使用
display:inline block
可能不是您想要的（我认为
float:left
部分也可能是错误的方法。例如：

<footer>
    <section id="content">
        <nav id="footer-links" class="center">   
            <a href="index.php" class="float-left">Home</a>
            <a href="about.html" class="float-left">About</a>
            <a href="contact.html" class="float-left">Contact</a>
            <a href="terms.html" class="float-left">Terms and Conditions</a>
        </nav>
    </section>
</footer>​


现在，
#页脚链接上的
文本对齐：居中实际上将内容居中。这一点很重要

还要注意的是，我确实使用了
display:inline block
（在
#页脚链接a
）中的
inline block
，这样我就可以设置一个定义的
边距
，而不继承间隙上的
1px点
下划线。但是，IE7和更低版本不支持
display:inline block
，您应该首先检查是否需要它就我个人而言，我会太担心它，除非你真的需要支持IE7和IE6。
我认为你可以消除所有这些ID/类，只需使用
内联块

哪个
部分
？有两个。为什么不干脆
文本对齐：居中
？不确定
显示：内联块
在这里试图解决什么问题。@JaredFarrish，我想用链接，
页脚链接
，而
内联块
背后的想法是我认为
页边空白处留下了：a我应用的uto；margin right:auto；
将使其居中。您只需在父元素上添加一个宽度。以下是您发布的内容（未修复）：为了演示，我调整并删除了一些属性（如
浮点值和宽度），但请检查：我认为这可能更接近您要查找的内容（并压缩）：注意顶部的
html，body
部分，它给了我一个
宽度
，可以在
页脚
上使用
nav
，而不是另一个
部分
。
background-color: 
rgba(0, 0, 0, 0);
color: 
rgb(255, 255, 255);
display: block;
font-size: 16px;
height: 19px;
margin-bottom: 0px;
margin-left: 312px;
margin-right: 312px;
margin-top: 0px;
position: relative;
width: 800px;

background-color: 
rgba(0, 0, 0, 0);
color: 
rgb(255, 255, 255);
display: inline-block;
font-size: 16px;
height: 19px;
margin-left: 0px;
margin-right: 0px;
width: 332px;

background-color: 
rgba(0, 0, 0, 0);
border-bottom-color: 
rgb(222, 222, 222);
border-bottom-style: dotted;
border-bottom-width: 1px;
color: 
rgb(222, 222, 222);
cursor: auto;
display: block;
float: left;
font-size: 16px;
height: 18px;
margin-right: 16px;
text-decoration: none;
width: 39px;

<footer>
    <section id="content">
        <nav id="footer-links" class="center">   
            <a href="index.php" class="float-left">Home</a>
            <a href="about.html" class="float-left">About</a>
            <a href="contact.html" class="float-left">Contact</a>
            <a href="terms.html" class="float-left">Terms and Conditions</a>
        </nav>
    </section>
</footer>​

html, /* This part allows me to set margin: 0 auto; on footer. */
body {
    width: 100%;
    margin: 0;
    padding: 0;
}
footer {
    background-color: rgb(53, 53, 181);
    color: rgb(255, 255, 255);
    display: block;
    font-size: 16px;
    height: 100px;
    width: 600px; /* Note this line. */
    padding: 10px;
    margin: 0 auto; /* Note this line. */
}
#content {
    background-color: rgba(0, 0, 0, 0);
    color: rgb(255, 255, 255);
    font-size: 16px;
    height: 19px;
    margin-bottom: 0;
    width: 600px; /* The same width as footer. Keep that in mind. */
}
#footer-links {
    background-color: rgba(0, 0, 0, 0);
    color: rgb(255, 255, 255);
    font-size: 16px;
    height: 19px;
    margin: 0 auto;
    width: 400px; /* 200px less than #content and footer */
    text-align: center; /* HINT! This actually centers the text. */
    font-size: 16px;
}
#footer-links a {
    background-color: rgba(0, 0, 0, 0);
    border-bottom: 1px dotted rgb(222, 222, 222);
    color: rgb(222, 222, 222);
    cursor: auto;
    text-decoration: none;
    height: 18px;
    display: inline-block; /* So the next line will work.  */
    margin: 0 8px;
}​