将绝对定位的DIV“完全”适合相对定位的父DIV？
RBV
我想使用CSS（而非JavaScript）将具有position：absolute 确切的子DIV放入其position：relative父对象中。正是问题所在。
如下图所示，子DIV很好地适合了父DIV的左/右和上边距，但父DIV的下边距溢出了（似乎是1px）。
关键是我为孩子DIV尝试了HEIGHT的各种组合。这种方法并不能真正解决问题，因为调整页面大小会相对于其父级移动子级DIV的底边距。因此，我认为解决方法不是更改HEIGHT的值。
这是CSS：
div.container{
position: relative;
background-color: #fafafa;
margin: 2%;
border: solid 2px orange;
padding: 2%;
height: 100%; /* Expands container to height of HTML & BODY */
}
div.leftSideNav,
div.rightSideNav
{
height: 100%; /* Changing height doesn't seem to truly fix the problem */
width: 1.5%;
background-color: #ccffcc;
margin: 0px;
border: solid 1px #33bb88;
padding: 0px;
position: absolute;
top: 0px;
color: #333333;
}
div.leftSideNav{
left: 0px;
background-color: pink;
}
div.rightSideNav{
right: 0px;
}
这是对应的XHMTL：
<body>
<div class="container">
<div class="leftSideNav" />
<div class="rightSideNav" />
</div>
</body>
我进行了“绕圈实验”，尝试使子DIV的底边距适合其父栏的顶部/左侧/右侧边距。我已经找到了很多一般性的讨论，但是没有一个专门讨论如何获得子DIV在其父内部的底边。
金杰夫
删除 height:100%;
并添加
top:0px;
bottom:0px;
你们都准备好了。完全跨浏览器兼容
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
编辑于
相关文章
TOP 榜单
- 1
Linux的官方Adobe Flash存储库是否已过时？
- 2
如何使用HttpClient的在使用SSL证书，无论多么“糟糕”是
- 3
错误：“ javac”未被识别为内部或外部命令，
- 4
Modbus Python施耐德PM5300
- 5
为什么Object.hashCode（）不遵循Java代码约定
- 6
如何正确比较 scala.xml 节点？
- 7
在 Python 2.7 中。如何从文件中读取特定文本并分配给变量
- 8
在令牌内联程序集错误之前预期为 ')'
- 9
数据表中有多个子行，asp.net核心中来自sql server的数据
- 10
VBA 自动化错误：-2147221080 (800401a8)
- 11
错误TS2365：运算符'！=='无法应用于类型'“（”'和'“）”'
- 12
如何在JavaScript中获取数组的第n个元素？
- 13
检查嵌套列表中的长度是否相同
- 14
如何将sklearn.naive_bayes与（多个）分类功能一起使用？
- 15
ValueError：尝试同时迭代两个列表时，解包的值太多（预期为 2）
- 16
ES5的代理替代
- 17
在同一Pushwoosh应用程序上Pushwoosh多个捆绑ID
- 18
如何监视应用程序而不是单个进程的CPU使用率？
- 19
如何检查字符串输入的格式
- 20
解决类Koin的实例时出错
- 21
如何自动选择正确的键盘布局？-仅具有一个键盘布局
我来说两句