Question

我有这个显示3个水平div的CSS，中心窗口：

.chatarea {
    display: table;
    padding-top:50px;
    margin:0px auto;
    width:80%;
}
.nick {
    width: 20%;
    border-right-style: solid;
    text-align: center;
    position:absolute; 
    top:0; 
    left:0;
}
.timestamp {
    width: 20%;
    border-left-style: solid;
    position:absolute; 
    top:0; 
    right:0; 
}
.message {
    border-style: solid;
    text-align:center;
    position:relative;
}

当内容/文字变长时，边框的高度不会扩展。

我也在这里创造了一个小提琴：http://jsfiddle.net/fGSsa/

Answer 1

您以表格格式呈现数据。使用<table>。

当你读到的那些CSS教程说的表是一些可怕的邪恶的东西，他们意味着使用表格进行演示/布局是可怕的/邪恶的。

在呈现表格数据时，使用<table>在语义上是准确的。

Answer 2

您可以简单地使用html表格

或者如果您仍想使用div：

您应该添加一个类行

   .row  {
        display: table-row;
        }

然后

.nick, .timestamp, .message {
    display: table-cell;
    }

请检查链接 http://snook.ca/archives/html_and_css/getting_your_di

CSS Divs不显示height属性

2 个答案: