html – 对齐单选按钮引导程序的问题

概述我有一个非常简单的表,但我在使单选按钮对齐中心时遇到一些麻烦.这是否需要使用CSS完成,或者有没有办法在输入或div上执行此 *** 作？ <div class="row"> <div class="col-md-12"> <div class="panel panel-info"> <div class="panel-heading"><strong>Standard Table</st 我有一个非常简单的表,但我在使单选按钮对齐中心时遇到一些麻烦.这是否需要使用CSS完成,或者有没有办法在输入或div上执行此 *** 作？

<div > <div >  <div >     <div ><strong>Standard table</strong></div>     <table >        <thead>           <tr>              <th></th>              <th>Estimated Graduation Date</th>              <th>College</th>              <th>Degree</th>              <th>Status</th>              <th></th>           </tr>        </thead>        <tbody>           <tr>              <td>                 <div  align="center">                    <label>                    <input type="radio" name="optionsRadios" ID="optionsRadios1" value="option1" checked >                    </label>                 </div>              </td>              <td>04/24/2014</td>              <td>Chandler Gilbert Community College</td>              <td>Bachelors of ScIEnce</td>              <td>In Progress</td>              <td>                 <!-- Single button -->                 <div >                    <button type="button"  data-toggle="dropdown">                    Action <span ></span>                    </button>                    <ul  role="menu">                       <li><a href="#">Action</a></li>                       <li><a href="#">Another action</a></li>                       <li><a href="#">Something else here</a></li>                       <li ></li>                       <li><a href="#">Separated link</a></li>                    </ul>                 </div>              </td>           </tr>            <tr>              <td>                 <div >                    <label>                    <input type="radio" name="optionsRadios" ID="optionsRadios1" value="option1" checked>                    </label>                 </div>              </td>              <td>04/24/2014</td>              <td>Chandler Gilbert Community College</td>              <td>Bachelors of ScIEnce</td>              <td>In Progress</td>              <td>                 <!-- Single button -->                 <div >                    <button type="button"  data-toggle="dropdown">                    Action <span ></span>                    </button>                    <ul  role="menu">                       <li><a href="#">Action</a></li>                       <li><a href="#">Another action</a></li>                       <li><a href="#">Something else here</a></li>                       <li ></li>                       <li><a href="#">Separated link</a></li>                    </ul>                 </div>              </td>           </tr>        </tbody>     </table>  </div>   </div></div>

解决方法 Demo

vertical-align：mIDdle：
使用父框的基线加上父框的x高度的一半来对框的垂直中点进行Alignes.

问题似乎是由于浏览器通常会向单选按钮和复选框添加一些随机不均匀的边距.

使用内联样式,奇怪但真实：

<input type="radio" > Label    <br/>    <br/>    <input type="radio" > Label        <br/>        <br/>        <input type="radio" > Label

编辑

this short explanation by Gavin Kistner,这很有用.我在该页面上尝试了最终建议,这似乎在Chrome,IE,firefox,Opera和Safari中得到了很好的体现.

我做的是添加td {line-height：1.5em}

总结

以上是内存溢出为你收集整理的html – 对齐单选按钮引导程序的问题全部内容，希望文章能够帮你解决html – 对齐单选按钮引导程序的问题所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。