Question

我有一个包含两个单元格的表格div。我希望细胞水平相互接触，每边都有一个相等的边框（在外面的DIV中间显示）。我有办法做到这一点吗？

<div id='hdr_msg' style='display: table; border: 1px solid red; width: 200px;'>
   <div id='hdr_txt'>
      <div id="hdr_msg1" style='display: table-cell; border: 1px solid blue;'>Test</div>
      <div id="hdr_msg2" style='display: table-cell; border: 1px solid green;'>One</div>
   </div>
</div>

我现在所拥有的是左边的测试一，但我需要它在中心。

Fiddle

Answer 1

你可能是这样写的：

<div id='hdr_msg' style='display: table; border: 1px solid red; width: 200px;'>
   <div id='hdr_txt' style="display: table;margin:0 auto">
      <div id="hdr_msg1" style='display: table-cell; border: 1px solid blue;'>Test</div>
      <div id="hdr_msg2" style='display: table-cell; border: 1px solid green;'>One</div>
   </div>
  </div>

检查此 http://jsfiddle.net/sandeep/bmtBU/3/

有关详情，请Steven theory CSS way to horizontally align table

CSS display：table - 如何使用display：table将两个单元格排列在另一个DIV的中心？

1 个答案: