- This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
Viewing 2 posts - 1 through 2 (of 2 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Hi guys my question is pretty simple. The image highlighted in bold below is appearing with some additional padding in IE7 above and below it. I want it to look the same as it does in Firefox which shows no padding. I’ve tried removing padding from the image, but to no avail. Id show you a demo but all this is being done local. I have provided code below for those wondering. Im sure the solution is quite trivial, but at the moment I can’t seem to figure it out. Thanks guys, look forward to hearing from you!
[b] [/b]
========
CSS
========
* {
margin: 0;
padding: 0;
}
div#header {
background: #000000 url(images/bg.jpg) repeat-x top;
position: relative;
width: 850px;
}
.fltr {
float: left;
position: absolute;
margin-top: px;
margin-left: 590px;
}
ul#nav {
position: absolute;
margin-top: 140px;
margin-left: 60px;
}
ul#nav li a {
display:block;
width: 100px;
text-decoration: none;
color: white;
}
ul#nav li a:hover, ul#nav li a:active {
text-decoration: underline;
}
ul#nav li {
float: left;
list-style: none;
}
div#wrapper {
width: 850px;
margin: 0 auto;
}
div#mainContent {
padding-bottom: 50px;
background: #263136;
color: white;
width: 850px;
}
div#mainContent p {
padding: 0 10px 0 10px;
}
Did a bit of testing, and the cause seems to be in the header.
No matter what element goes after the header, there seems to be a bit of spacing.