Question

检查此示例：http://jsfiddle.net/RvSK5/ 尝试调整窗口大小...

如何将表格stretch和shrink始终设置为父元素的100％宽度和高度。

如果我们将div缩小到非常小的尺寸，<p>会阻止桌子缩小。我该如何解决这个问题？

Answer 1

在您的示例中，段落中的文本阻止表格单元缩小到父div的宽度。假设父div可以更宽，只需将width: 100%添加到表中即可。

#table{
    border: 1px solid green;
    width: 100%;
}

示例：http://jsfiddle.net/RvSK5/3/

Answer 2

请执行以下操作：

#test{
    width:10%;
    height:50%;
    background-color:red;
}

#table{
    border: 1px solid green;
    width:100%; /* Make the width 100% of the parent */
}

如果您想获得更多见解，我建议您阅读http://www.impressivewebs.com/width-100-percent-css/

Answer 3

看到您必须为表格提供100％的宽度和高度，以使其延伸到其父div高度和宽度check out this link

使用div制作表格

3 个答案: