如何让内部div填充整个包装器div？
如何让内部div填充整个包装器div？
提问于 2010-04-28 04:15:35
我有以下html代码：
<div class="outer ui-draggable" style="position: relative;">
<div class="inner">Foo bar</div>
</div>使用此CSS：
.outer
{
background-color: #F7F085;
margin: 5px;
height: 100px;
width: 150px;
text-align:center;
vertical-align:text-bottom;
}
.outer .inner
{
display:inline;
vertical-align:middle;
height: 100px;
width: 150px;
}我希望内部div完全填充外部div -文本块应该是一个完整的100X150框。
问题是这段代码并没有产生预期的效果。外部div确实是正确的大小，但是内部div似乎只填充了外部div顶部的一小块区域。
我还尝试使用height:inherit和width:inherit而不是指定大小。
回答 2
Stack Overflow用户
回答已采纳
发布于 2010-04-28 04:17:43
问题出在display:inline风格上。如果你想让它表现得像一个普通的DIV，那就让它保持display:block。如果它是display:inline，那么它的高度只能与继承的行高一样高。
Stack Overflow用户
发布于 2010-04-28 04:20:02
可能是因为垂直对齐样式属性。这是无效的样式规则。它仅适用于具有display：<tr> - <td>的表格单元格和<div>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/2724734
复制相关文章
相似问题
腾讯云开发者
