我的页面上有一个区域#topLeft,它设置了最小高度。
在#topLeft 中,我有一个#heroBanners 部分,我希望将其锚定到#topLeft 的底部 - 使用 position:absolute;底部:0;
一开始这工作正常,但是当#topLeft 应该展开时它不是并且 heroBanner 部分只是与它上面的内容重叠。
我假设问题是通过混合最小高度和绝对定位内容来调用的?
关于如何解决这个问题的任何想法,代码如下:
<div id="topLeft">
<div class="linksBox">
<ul>
<li>Item 1</li>
<li>Item2 </li>
<li>Item 3</li>
<li>Item4 </li>
</ul>
</div>
<div id="#heroBanners">
</div>
</div>
#topLeft {margin:0 27px 27px 0; width:478px; min-height:378px; *height:378px; *margin-bottom:22px; position:relative;}
#heroBanners {bottom:0; position:absolute;}
最佳答案
如果将 block 或 div 都放在一个新的 div 中并将其样式设置为 {bottom:0; 会很容易position:absolute;
} 而不是 heroBanners。
<div id="parent">
<div id="topLeft">
<div class="linksBox">
<ul>
<li>Item 1</li>
<li>Item2 </li>
<li>Item 3</li>
<li>Item4 </li>
</ul>
</div>
<div id="#heroBanners">
</div>
</div>
</div>
#topLeft {margin:0 27px 27px 0; width:478px; min-height:378px; *height:378px; *margin-bottom:22px; position:relative;}
#parent {bottom:0; position:absolute;}
关于html - 绝对定位的最小高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5154149/