html - 怎么设置div的宽度为表格里面的宽度呢？

Question

我有一个 div，其中包含一个 table。一切都按我想要的方式工作，除了我不知道如何设置 div 的 width 以便它随着 width 的增长而增长它里面的 table 变大了。我怎样才能做到这一点？谢谢。

这是 div 的 CSS 代码:

#events-table-wrapper {
    margin-left: auto;
    margin-right: auto;
    width: 500px;
    margin-top: 100px;
    border: 1px solid #CCC;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}

将 width 设置为 auto 没有帮助。顺便说一句，我没有更改 CSS 表格中的任何内容。

编辑:这是一个实时版本:http://jsfiddle.net/ZDF2U/

Answer 1

在您的情况下，您还可以在 div 中执行:

display: table;

这是 jsFiddle:http://jsfiddle.net/leniel/Et3t5/

---

这是另一个 jsFiddle，它向您展示了一个类似的案例:http://jsfiddle.net/leniel/T7DTc/

如果 div 的 width: auto; 则它会扩展以容纳表格内的 textarea。如果将其设置为 width: 500px;，则 textarea 会在 div 之外增长。

所以解决方案看起来像设置 width: auto;。当然，您代码中的某些特殊内容可能会造成干扰。