html - 如何对齐网站页脚上的元素

Question

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

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

Answer 1

您为社交图标使用表格有什么特别的原因吗？像这样的事情建议使用 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.
}