Question

我有以下代码：

<div class="rep_tb0" style="width: 100%">
    <div class="rep_tr0" style="width: 100%">
        <div class="rep_td0" style="width: 100%" id="ActivityLog">Activity Log</div>
    </div>
</div>

.rep_tb0 {display: table; }
.rep_tb0 {padding: 5px;}
.rep_tb0 {border-collapse:collapse; }
.rep_tr0 {display: table-row;}
.rep_td0 {display: table-cell; padding: 5px; vertical-align:top; }
.rep_td0 {border: 1px solid #666; }

我想要的是活动日志一词水平延伸以填充包含它的DIV的表格。请注意，DIV具有宽度设置，但可能很容易更改。正如你所看到的，我尝试在三个地方设置宽度但没有工作。

如何在不设置宽度（以像素为单位）的情况下水平填充区域。

请不要忘记我正在使用display：table;这些不是正常的DIV： - ）

Answer 1

我经常制作一个我想要的容器和相对位置的容器;和一个具有绝对值的内部div，如下：

<div id="container">
    <div id="content">Content</div>
</div>

然后css看起来像这样：

#container{
    width:70%;
    min-width:600px;
    height: 600px;
    background:#000;
    border:medium;
    border-color:#CCC;
    border-radius:10px;
    display:block;
}
#content{
    position:absolute;
    display:block;
    top:0;
    left:0;
    width:100%;
    height:100%;
}

Answer 2

我会尝试两件事。摆脱width:100% div中的硬编码rep_td0，然后在没有任何宽度的情况下在css中执行margin:0px auto。如果这不起作用，请尝试为reptb0 div提供带有像素而不是百分比的宽度，并对reptd0 div执行相同操作。

如何制作我的展示：桌子; DIV填充包含它的DIV的水平宽度？

2 个答案: