css - 仅当内容具有固定高度时如何显示 div？

Question

我在 div 中显示了一些错误消息。默认情况下，div 应该是隐藏的，并且只有当有任何错误内容可用且具有固定的可滚动高度（仅垂直滚动）时才应该显示它。

我只需要使用 CSS 来执行此操作。此外，当单击按钮时，此错误消息来自 asp.net validationsummary 控件。

提前致谢。

Answer 1

这是您在小提琴中的答案，其中包含相同的 div 一次错误然后没有错误：http: //jsfiddle.net/WhQgM/1/

包括将包含这些错误的 div 的 css：

.container{
    max-height:50px;
    overflow-x:hidden;
    overflow-y:auto;
    width:200px;
    background-color:red;
    color:#fff;
}

您可以调整此 div 的颜色和最大高度，并根据您的需要进行制作。

Answer 2

<style>
.panel:before {
     content: attr(data);
     display:block;
     min-height: 100px;
     height: 100px;
     width:100%;
     overflow-x:scroll;  /* or overflow-y:scroll */   
}
</style>
<div class="panel"></div>
<div class="panel" data="error: hello world"></div>