css多个不定数量提交按钮居中显示，纯css解决_html/css_WEB-ITnose

在一行中有三个按钮或是两个按钮...个数不定，然后间距固定；然后就有很多人把所有按钮放到一个div中，把div置为margin:10px auto(距上10像素，居中，然后又给了一个固定宽度，按钮放在这个div中，这样按钮就不能具体居中了) ，也不通用如果按钮减少到两个 或一个怎么办，

也有很多人用javascript 动态的算出宽度然后计算一大堆，并且很多时候比好用

错误代码：

 1  2  3  4     <meta charset="utf-8"> 5     <title></title> 6     <style type="text/css"> 7     .foot{width: 100%; height: 30px; border: 1px solid #d2d2d2;} 8     .foot .b{width:300px; margin: 3px auto;} 9     .foot .b .button{display: inline-block;line-height: 20px; background-color: #900; padding: 3px 5px; margin-left: 10px;}10     </style>11 12 13 <div class="foot">14     <div class="b">15         提交16         提交17         提交18     </div>19 </div>20 21 

后来修改如下

    <meta charset="utf-8">    <title></title>    <style type="text/css">    .foot{width: 100%; height: 30px; border: 1px solid #d2d2d2; text-align: center;}    .foot ul{display: inline; margin-left: -10px;}    .foot ul li{display: inline-block; margin-left: 10px; line-height: 30px;}    .foot ul li a{background-color: #900; color: #fff;line-height: 20px;padding: 3px 5px;}    </style><div class="foot">    <ul>        <li>提交</li>        <li>提交</li>        <li>提交</li>        <li>提交</li>    </ul>    </div>