html绝对定位重叠,绝对定位的div图像重叠_html_开发99编程知识库

我正在尝试将一个社交媒体栏放在一个网站上，并使用图像作为每个网站的链接。 我有一个动画设置为每个图像和动画要正常工作，img 位置需要设置为 absolute 。 然而，我所遇到的问题是，在 div="crossfade 之间，所有的图像都堆叠在一起。 我已经处理了 3小时了，没有逻辑解决方案。 如何分隔各个链接。

html :

css:#social-icons {

background-color:#291F32;

width:100%;

position:fixed;

bottom:0;

margin:0px;

}

#crossfade {

position:relative;

}

#crossfade img {

position:absolute;

margin:0px auto;

left:0;

right:0;

-webkit-transition: opacity. 3s ease-in-out;

-moz-transition: opacity. 3s ease-in-out;

-o-transition: opacity. 3s ease-in-out;

transition: opacity. 3s ease-in-out;

}

#crossfade img:hover {

opacity:0;

}