Question

我的主要div（带有红色边框的DIV）有问题 - 它没有调整内容大小。我已经尝试过的就是这个认可：

div{
min-height:1%;
overflow:hidden;
}

但在这种情况下，它不起作用。我甚至在内部元素上使用它，而不仅仅是在外部DIV上。

这个内部DIV增加了几个跨度：

<div id="spanOfferHeaderData" style="display:block;min-height:1%;overflow:hidden;min-width:1%;">                
    <span><strong>PONUDBA ŠT.: 000017-2017</strong><span><br>
    <span>Datum: 05.09.2017<span><br>
    <span>Datum veljavnosti: 07.09.2017</span><br>
    <span>Kraj izdaje: Ljubljana</span><br/>
    <span>Dogodek: Test dogodek</span><br>
    <span>Lokacija: Celje - Maribor</span><br>
    <span>Opis: Opis opis opis opis<span><br>
    <span>drugi Opis: Opis opis opis opis<span><br>
</div>

只有两个跨距可见，其他跨距不可见（因为主DIV不会随内容调整大小）。我还能做些什么来用内容调整主DIV的大小？

我已经完整地展示了here

Answer 1

其中一个DIV包裹您的跨度具有以下CSS属性：

position: absolute;
top: 180px;

绝对位置将其从文档流中移除，顶部将其向下推180像素。然后你有：

overflow: hidden;

在其中一个容器上，parent表示容器中扩展出容器的所有元素都有从视图中隐藏的溢出内容。

我已经分叉了您的CodePen并删除了这些属性以获得我认为您想要的结果：https://codepen.io/anon/pen/MvdRqB?editors=1010

我已经删除了绝对定位，因为您已经说过您希望容器根据内容调整大小，但它不会将绝对定位的元素计为内容，因为正如我之前所说，它们已从文件流程。

我强烈建议不要使用内联样式，也要使用某种表格结构，即使是填充它也会崩溃并弄得一团糟，小心你的结构并简单地做。

主DIV高度不会随内容调整大小

1 个答案: