添加边框div将其他div推出框外

Question

我在div的鼠标悬停上添加了一个div边框，但是它推出了其他div开箱即用。

我有固定的高度和宽度，行有4个div。最后有两行，8个div，高度固定。 当我将鼠标悬停在任何div上时，它会将主框下面的所有div推到它下面。

我试图增加主箱的高度，但它仍然推出。 任何人都可以帮我解决这个问题。

Answer 1

边框被添加到宽度，所以它使得moused-over元素变得更大..这推动了其他divs ..

这是正常行为..

您可以使用outline代替边框，但IE支持有限（ IE8及以上）..

Answer 2

将边框添加到元素的宽度。默认情况下，您可以尝试使用透明颜色（或适合您设计的颜色）的边框，并且在鼠标悬停时仅更改边框的颜色。当然，你必须从固定的高度和宽度中减去边框宽度。

Answer 3

为所有div元素添加透明边框。然后在您的悬停事件中修改边框颜色/类型。这将使div保持原状。

Answer 4

将主div内的框设置为具有顶部/左侧值的绝对位置。

box1{
    position: absolute;
    left: 5px;
    top: 5px;
}

box2{
    position: absolute;
    left: 5px;
    top: 55px;
}

。 。