div内的浮动链接将图像的中心固定在同一行上

Question

首先，我要感谢那些在此之前帮助过我的人。

好的问题是这样的：我有几个图像放在一个名为“Banner”的div中 在我的网站顶部。我还有一个文本链接到Facebook，它向右浮动。它们各自使用以下css ...

        #banner img {border:none;
         margin:0 auto;
         display:block;
         }
        a#social_network {
              float:right;
              margin:10px;
              padding:0px;
              }

我还向右侧添加了一个指向facebook的链接，该链接被称为“social_network”，并且也在横幅div中。问题是当我将这个文本链接向右浮动时，我的顶部图像不再居中。我想也许我需要清除浮动但是这不起作用我做错了。

所有建议都表示赞赏。

Answer 1

也许你可以试试这个：

#banner { 
    position: relative:
}

#banner img {
    border: none;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -100px; /* <--- Here's 1/2 of the width of the image */
    margin-top: -50px; /* <--- Here's 1/2 of the height of the image */
}