FooterWrap 打破盒子
我的页脚 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;
}
What's up with my Footer CSS ?
Using the Web Dev toolbar in Firefox I can see that it's got a box and it seems to be pushing it all down to the next line - no padding or margins that I can see..
I'm sure it's an easy fix - if someone could point out what's up that would be ace!
Thanks guys!
Website is here for Love Jungle Clothing Brand
Here is the code:
/****** 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;
}
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
您是否尝试使用“页脚粘贴”方法?或者您只是想让文本内容垂直居中。如果是后者,请尝试以下操作:
查看页脚文件,您有以下 html:
此行:
需要删除。
如果您想了解有关页脚粘贴方法的更多信息,请查看 http://bonrouge.com/~home
Are you trying to use the "footer stick" method? Or do you just want to have the text content sort of vertically centered. If the latter, try this:
Look in your footer file, you have the following html:
This line:
<a href="/about/"></a><li><a href="/about/">Made in Australia</a></li>
needs to be removed.If you want more info on the footer-stick method check out http://bonrouge.com/~home