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 回答