不能正确对齐文本 - 引导

我有以下代码：不能正确对齐文本 - 引导

<div class="col-md-9 col-md-offset-3"> 
    <div class="col-md-9"> 
     <div class="page-header"><h3>Your Profile</h3></div> 
     <div class="col-md-5"> 
      <div class="col-md-4 text-right">Name:<br><br>Email:<br><br>Phone:<br><br>Gender:</div> 
      <div class="col-md-8 text-left">John Smith<br><br>[email protected]<br><br>07878787456<br><br>Male</div> 
     </div> 
     <div class="col-md-7"> 
      <div class="col-md-4 text-right">Name:<br><br>Email:<br><br>Phone:<br><br>Gender:</div> 
      <div class="col-md-8 text-left">John Smith<br><br>[email protected]<br><br>07878787456<br><br>Male</div> 
     </div> 
    </div> 
</div>

出于某种原因，它会显示这样的：http://i.imgur.com/0YPMWf3.png

这里是一个的jsfiddle（扩展输出框的大小）：http://jsfiddle.net/z49Ry/

带有“名称：”等的文本应该对齐正确，其他文本应该左对齐。出于某种原因，“姓名：”等不能正确对齐左侧。

我猜这是因为跨度太小，如果是的话，那么显示数据的更好的解决方案是什么？

来源

2014-01-22 Jonnerz

可能是行高。 –

我真的不知道你的代码中有任何错误。就像你说的那样，它可能是由于柱子太薄而造成的。

使用BR来分隔数据可能是最糟糕的方法。用于表格数据使用表。如果表不是你正在寻找的，你可以使用无序列表或描述列表（DL）。

来源

2014-01-22 19:00:50 SamSam

不能正确对齐文本 - 引导

回答

相关问题