1

似乎有大量的 CSS 问题可供搜索，但我还没有找到任何可以回答我的问题的解决方案，也没有任何解决方案能够解决问题。

我想要一堆 div，每行一个，在父容器内居中，并根据其文本内容具有自动宽度。

我使用 display: inline-block 管理的自动宽度部分，但最后我得到了彼此相邻的 div（尽可能多的可以放入父容器中）。

有什么帮助吗？谢谢！

编辑：另外，我考虑过使用 Table 路线，这是否是正确的做法（即单列多行的表）

编辑：一个例子总是让事情更清楚......

我有一个包含一系列 div 的列：

<div id="giant-column" style="width: 800px; margin: 0 auto;">
  <div class="column-element" style="margin: 0 auto; display: inline-block;">
    <div class="text" style="width: 100%; clear: both;"> ... </div>
    <div class="author" style="float: right;"> ... </div>
  </div>
  ...
</div>

我希望每个“列元素”仅与“文本”一样宽，但在更大的列“巨型列”中居中。这有意义吗？

4

3 回答 3

2 
div.column-element{
  margin: 0 auto;
}
于 2012-06-10T21:18:08.653 回答
0

你有没有尝试过

margin:0 auto;

在您的内部 div 中？

表格设计不是那么灵活，所以我们认为它不是一个好的解决方案。无表设计有很多不同的选择。

于 2012-06-10T21:10:47.527 回答
0

哈！想通了...我需要另一个 div 元素，它用 width: 100%; 包裹每一行。

<div id="giant-column" style="width: 800px; margin: 0 auto;">
  <div style="width: 100%;">
  <div class="column-element" style="margin: 0 auto; display: inline-block;">
    <div class="text" style="width: 100%; clear: both;"> ... </div>
    <div class="author" style="float: right;"> ... </div>
  </div>
  </div>
  ...
</div>
于 2012-06-10T21:29:53.440 回答