css - 同一页面上的多个 Addthis 按钮，绝对位置只显示第一个

Question

所以我有 3 个框，每个框都有小的共享按钮，位于框的右上角(绝对 css 位置)。

Addthis 只会在悬停在第一个上时显示，如果 css absolute 被删除那么它将在所有框中工作。我试过在实际的 sharethis 元素上设置 absolute 并将其放在绝对容器中。两者都不起作用。我在 addthis 网站上找不到示例。

这是我围绕 addthis 尝试的绝对容器，这个 div 在更大的 div 里面

一些内容

<style>

.promotionItem { position:relative；

#promotionsSlider .shareContainer {
 width: 30px;
 height: 29px;
 position: absolute;
 top: 0;
 right: 0;
 display: block;
}
</style>

Answer 1

您将所有共享按钮放置在彼此之上，通过使用绝对位置，它们不会尊重彼此在 Dom 中的位置...您需要根据您所在的位置为每个按钮提供一个左侧或垂直的绝对位置想让他们坐下。

下面我假设您有 3 个要放置的图标，我将它们水平对齐。

#promotionsSlider .shareContainer {
 width: 30px;
 height: 29px;
 position: absolute;
 top: 0;
 right: 0;
 display: block;
}

#promotionsSlider .shareContainer:nth-of-type(2) {
 right: 40px;
}

#promotionsSlider .shareContainer:nth-of-type(3) {
 right: 80px;
}