0

我有一个 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），我想避免它。

我想知道我做错了什么？

4

1 回答 1

2

我今天有点傻。

我删除了边距并使用：

top: 5%;
left: 5%;

它解决了我的问题。

于 2013-08-09T11:05:56.407 回答