1

我想移动 facebook 和 twitter 按钮,让它们在我的临时网站上更明显:

gaberivers.com

现在它们位于页脚下方,没有人可以看到它们。我想将它移到第一个文本列旁边。在那个文本框之外......这样人们会更好地看到它。

演示:

http://jsfiddle.net/ZWq8g/

4

2 回答 2

2

好的,如果我理解正确,您是在尝试将 Facebook 和 Twitter 图像移到列的左侧。因此,让我们创建一个新列,columnSocial在 CSS 中调用和:

#columnSocial {
line-height:120px;
background-color:#394046;/*background: url(black.jpg) no-repeat 0 0;*/
width:64px;
height:250px;
float:left;
position:relative;}

我从您现有的列中复制了大部分内容 - 请务必向下编辑其他列之一的宽度以容纳(您的列容器仅允许 900 像素,因此您需要在其他地方剃掉 36 像素)这个新列。该line-height属性对于获得一些垂直间距很有用,因为我们不能vertical-align在 div 元素上使用。

在您的 HTML 中,您需要添加:

<div id="columnSocial">
     ...
</div>

在您的容器开始之后和 column1 开始之前。随意切换任何你喜欢的数字,但这应该得到类似于你所要求的东西。

作为一般的设计说明,拥有良好的结构(如列的容器)需要大量的工作来完成这样的更改——移动图像最终变得微不足道,因为我们所要做的就是制作一个新的柱子。

于 2012-10-09T18:07:20.833 回答
0

这是您需要的:-您的页脚应该像

<div id="footer" style="text-align: center;">
<p>&copy; 2012 Angloesfera. Todos los derechos reservados.</p>
<div id="snetworks">
        <a class="show" href="https://www.facebook.com/pages/Academ%C3%ADa-AngloEsfera/190496871000029"> <!--a http-vel kell a link...vagy          kulonben az en oldalamon belul fogja keresni a linket-->
        <img width="36" height="36" rel="" title="" alt="facebook" src="images/facebook.png"></a>

        <a class="show" href="https://twitter.com/GoE_Shop">
        <img width="36" height="36" rel="" title="" alt="facebook" src="images/twitter.png"></a>
</div>
</div>

和 #snetworks 的 css

#snetworks {
    left: 100px;
    position: absolute;
    top: 2px;
}
于 2012-10-09T18:00:00.223 回答