我有一个 div,它的 CSS 最初定义为:
.mydiv {
position: absolute;
top: 60px;
left: 60px;
right: 60px;
bottom: 60px;
background-color: cyan;
overflow: hidden;
}
这与屏幕边框的距离相等,我想通过 jQuery 使其可拖动。由于 right 和 bottom CSS 指令,这不起作用。
所以我的下一个想法是使用这个 CSS 定义:
.mydiv {
position: absolute;
width: 90%;
height: 90%;
margin-left: 5%;
margin-top: 5%;
background-color: cyan;
overflow: hidden;
}
根据我的理解,这将创建一个宽度和高度等于屏幕宽度/高度的 90% 的 div,另外,边距指令(每边 5%)会将其定位在屏幕的中心。
该解决方案似乎不适用于 100%。
它水平工作,div水平居中但垂直底部的空间小于顶部的空间。这不是我想要的。
我知道我可以用calc()
不同的方式解决它,但由于浏览器兼容性(IE8),我想避免它。
我想知道我做错了什么?