将宽度/高度设置为百分比减像素

582

我正在尝试创建一些可重复使用的CSS类,以实现更一致性和更少的杂乱在我的网站上,并且我卡在了尝试标准化我经常使用的一个东西上。

我有一个容器<div>,我不想为其设置高度(因为它将根据其在网站上的位置而变化),里面有一个标题<div>,然后是一个应用了CSS的项目无序列表

它看起来很像这样:

Widget

我希望无序列表占据容器<div>中剩余的空间,知道标题<div>的高度为18px。我只是不知道如何将列表的高度指定为“100%减去18px的结果”。

我在SO上看到过这个问题在其他情况下被问到,但我认为为我的特殊情况再次提问是值得的。有人对这种情况有什么建议吗?


9
设置边距?__ - kennytm
@KennyTM,我猜你建议我在我的无序列表上加一个margin-top,比如说17px。但这只是把整个列表往下推;它并没有导致它缩小以适应容器。基本上,它的当前高度保持不变,但它只是被向下推了17像素。这并没有解决我的问题,但我认为这是朝着正确方向迈出的一步,因为我在网上看到过其他使用这种技术的方法。 - Matt
我刚刚解决了我在这里发布的问题。http://stackoverflow.com/a/10420387/340947 - Steven Lu
可能是CSS如何将div高度设置为100%减去n像素?的重复问题。 - 200_success
11个回答

0

我不确定这是否适用于您的特定情况,但我发现在内部div上添加填充会将内容推动到div内部,如果包含div是固定大小的话。您必须将标题元素浮动或绝对定位,但除此之外,我尚未尝试过可变大小的div。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接