css - FooterWrap 打破盒子

标签 css wordpress footer

我的页脚 CSS 怎么了?

使用 Firefox 中的 Web Dev 工具栏我可以看到它有一个框,它似乎将它全部推到下一行 - 我看不到填充或边距..

我相信这是一个简单的修复 - 如果有人能指出发生了什么,那就太棒了!

谢谢大家!


网站在这里 Love Jungle Clothing Brand

代码如下:

/****** Footer *****/
/*new div Neil */


#footerwrap
{width: 100%;
margin: 0 auto;
text-align:left;
height:40px;
background-color:#000;
clear:both;
margin-top:10px;
overflow:hidden;
z-index:1000;
}




/*new div container Neil */
#footer {
    width: 990px;
    height:60px;
    margin: 0 auto;
    padding-top:10px;
    background-color:#000;
    clear:both;
    text-align:center;
    z-index:1000;
}


#footer ul {
    padding: 0px 0 0 0;
    margin: 0 0 0 0px;
    list-style-type: none;
}
#footer li {
    float: right;
    padding: 0;
    margin: 0 auto;
    display: inline;
}




#footerLeft ul {
    padding: 0px 0 0 0;
    margin: 0 0 0 0px;
    list-style-type: none;
}
#footerLeft li {
    float: left;

}


#footer a {

    display: block;
    height: 40px;
    background-repeat: no-repeat;
    display: inline;
    text-decoration:none;
    text-align:center;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 90%;
white-space:nowrap;
    margin:0 auto;
        z-index:1000;


}



#footerwrap a {

    display: block;
    color:#fff;
    height: 20px;
    background-repeat: no-repeat;
    padding-right:40px;
    margin:0 auto;
        z-index:1000;

}




/****** Footer *****/
/*new div Neil */


#footerwrap
{width: 100%;
margin: 0 auto;
text-align:left;
height:40px;
background-color:#000;
clear:both;
margin-top:10px;
overflow:hidden;
z-index:1000;
}




/*new div container Neil */
#footer {
    width: 990px;
    height:60px;
    margin: 0 auto;
    padding-top:10px;
    background-color:#000;
    clear:both;
    text-align:center;
    z-index:1000;
}


#footer ul {
    padding: 0px 0 0 0;
    margin: 0 0 0 0px;
    list-style-type: none;
}
#footer li {
    float: right;
    padding: 0;
    margin: 0 auto;
    display: inline;
}




#footerLeft ul {
    padding: 0px 0 0 0;
    margin: 0 0 0 0px;
    list-style-type: none;
}
#footerLeft li {
    float: left;

}


#footer a {

    display: block;
    height: 40px;
    background-repeat: no-repeat;
    display: inline;
    text-decoration:none;
    text-align:center;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 90%;
white-space:nowrap;
    margin:0 auto;
        z-index:1000;


}



#footerwrap a {

    display: block;
    color:#fff;
    height: 20px;
    background-repeat: no-repeat;
    padding-right:40px;
    margin:0 auto;
        z-index:1000;

}

最佳答案

您是否尝试使用“footer stick”方法?或者您只是想让文本内容垂直居中。如果是后者,试试这个:

查看您的页脚文件,您有以下 html:

<div id="footerwrap"> 
   <div id="footer">
      <div id="footerLeft">
      <a href="/about/"></a><li><a href="/about/">Made in Australia</a></li>
      </div>

<ul>
<span>
<center>
         <li><a href="/store/">Store</a></li>
         <li><a href="/about">About</a></li>
         <li><a href="/press">Press</a></li>
         <li><a href="/stockists">Stockists</a></li>
         <li><a href="/contact"><span>Contact</span></a></li>
</center>
</span>
</ul>

    </div>
</div>

这一行: <a href="/about/"></a><li><a href="/about/">Made in Australia</a></li> 需要删除。

如果您想了解更多关于 footer-stick 方法的信息,请查看 http://bonrouge.com/~home

关于css - FooterWrap 打破盒子,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3619310/

相关文章:

flutter :试图使列中的项目底部居中,但它保持左对齐

页脚跨浏览器(IE、FF、Chrome)的 css chrome 问题

css - 我的 "footer"如果页面没有出现在脚下?

html - 仅通过 CSS 选择父 ul 下的 li

html - 背景图片、手机和媒体查询

php - 我的 WordPress 自定义插件无法连接到数据库

php - 权限问题 : How to setup permissions on docker for windows for use with Wordpress

asp.net - Datagrid Asp.net 标题后面的菜单项如何避免?

javascript - 将 jQuery/JavaScript 代码添加到 php 文件

mysql - WordPress自定义查询搜索速度慢