当其他div变大时，DIV会移动

Question

当我将鼠标悬停在链接上时，文本会变大，我有两个div相邻，当我将鼠标悬停在左侧div上最长的链接时，右侧div会向右移动。 我该如何解决这个问题？

#social{
    font-size: 100%;
    float: left;
    padding:5px;
}

Answer 1

使用position:absolute，使用此功能，第二个菜单将不依赖于第一个菜单的定位，并将保留在top和left的位置。

Answer 2

尝试更改链接的CSS

a:hover{
text-decoration:none;
}

你也可以编辑悬停所发生的一切，所以字体大小，颜色等等

Answer 3

那么，首先你可以通过使用：hover选择器来决定链接在它们上面时的外观。例如：

a:hover {
    font-size: 30px;
}

现在，导致其他div移动的是链接变大的事实。看起来您的悬停效果会使链接文字粗体。尝试删除它，因为它是一个真正的痛苦，可以解决。如果你需要覆盖它：

a:hover {
    font-weight: normal; // Add !imporant after 'normal' if nothing happens.
}

Answer 4

由于div的默认布局，当您悬停的链接更改大小时，它会“推”旁边的div以容纳更大的文本。最容易做的事情是，当文本移动页面元素时，文本不会放大。否则，您还可以使用CSS div，position，left和{{1}的组合，使用CSS right手动定义第二个top的位置}}）。

Answer 5

你的问题有两个方面。向左浮动将意味着它左边的任何元素的最大宽度调整大小的时刻将比右边的所有div移动以适应，或者如果右边的视口中没有空间则向下移动。因此，当您将鼠标悬停在文本效果上时，它将按照您的描述进行操作。

接下来你可能有一些CSS冲突导致它在你悬停时变大。正如其他人已经说过的那样，使用锚标签调整CSS可能会解决您的问题。

a:hover {
text-decoration: none;
font-size: inherit;
}

那应该解决你的问题，否则删除font-size：inherit，你就没事了。