0

我正在网站 www.albafitness.com 上工作

如您所见，社交媒体图标和页脚菜单不是水平对齐的。有人可以告诉我该怎么做吗？

4

3 回答 3

0

您使用表格作为社交图标有什么特别的原因吗？推荐使用 ul 标签来处理这样的事情。

试试这个 CSS：

.footer_content {
    border-top: 1px solid #1F2024;
    clear: both;
    float: left;
    margin: 30px 30px 0;
    padding: 20px 0 0;
    width: 940px;
    text-align: center; // Align both elements horizontally
}

table.cnss-social-icon tr td, table.cnss-social-icon, table.cnss-social-icon tr {
    background: none repeat scroll 0 0 transparent !important;
    border: medium none !important;
    margin: 0 !important;
    padding: 0 !important;
    vertical-align: middle !important;
    display: inline-block; // inline-block will make it inherit rules from text-align rule
}

.footer_menu {
    padding: 10px 0;
    // float: right; //float will always pull your element to one side. This should be removed.
}
于 2013-08-17T20:08:05.957 回答
0

要定位某物，您拥有三个超能力：1. POSITION ABSOLUTE 2. VERTICAL ALIGN 3. FLOAT

这次我们使用的是 no。1个CSS：

.footer_content_wrraper
{
    position:absolute;
    bottom:0;
}

HTML：

<div class="footer_content_wrapper">
....../
</div>
于 2013-08-17T20:10:48.783 回答
0

如果您需要保留相同的 html，您可以在菜单上使用负边距

.footer_menu {margin-top: -21px}

但是当您缩小到移动尺寸时，您需要将其删除，这将是一个媒体查询。所以它们不会重叠

于 2013-08-17T20:11:13.780 回答