|
fakeeyed -> css footer is too high in firefox (11/21/2005 16:22:40)
|
alright, first off... the site looks great in IE and all code validates. i had to fudge the padding a bit using child selectors for the side pads, but now the footer is too high in firefox (but again, lines up perfect in ie). i have a content div, and within it, 2 columns of information. i believe the left column is causing the problem and that one is floated. right now, the content on the left side is longer than on the right... but i need the footer to be 10 pixels below whichever one is longer. any ideas? heres the css code...
body {
background: url("../bg.gif");
background-color: #333333;
color: #FFFFFF;
font: 12pt Arial, Helvetica, sans-serif;
text-align: center;
width: 100%;
}
#container {
text-align: center;
width: 700px;
margin-right: auto;
margin-left: auto;
margin-top: auto;
background-color: #333333;
color: #FFFFFF;
border: 1px #999999 solid;
}
#header {
height: 125px;
width: 700px;
background: url("../BANNER.jpg") 0 0 no-repeat;
text-align: center;
}
#dropdown{
position: absolute;
border: 1px solid black;
border-bottom-width: 0;
font: normal 12px Verdana, sans-serif;
line-height: 18px;
z-index: 100;
}
#dropdown a{
width: 100%;
display: block;
text-indent: 3px;
border-bottom: 1px solid black;
padding: 1px 0;
text-decoration: none;
font-weight: bold;
}
#dropdown a:hover{
background-color: #00ffff;
color: #000000;
}
#navigation {
width: 700px;
height: 25px;
background-color: #d32f0d;
color: #ffffff;
text-align: center;
}
#content {
display: block;
}
#sideLine {
float: left;
padding-top: 10px;
padding-left: 10px;
width: 200px;
}
/* IE sucks */
div>div #sideLine {
float: left;
padding-top: 10px;
padding-left: 10px;
padding-right: 10px;
width: 200px;
}
#mainLine {
padding-top: 10px;
width: 470px;
}
#footer {
width: 700px;
height: 20px;
background-image: url('../footerbg.gif');
border-top: 1px #999999 solid;
}
/******************* content box classes *******************/
.divvy {
padding-bottom: 10px;
}
.maindivvy {
padding-bottom: 10px;
}
/******************* style classes *******************/
.tBox {
border: 1px solid #d32f0d;
}
.paddedCell {
text-align: justify;
padding: 3px;
}
.style1 {
color: #FFFFFF;
background-color: #333333;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}
.notchedEdge {
}
/******************* side headers *******************/
#sideNavHeader1 {
background-image: url('../elements/sideNavHeader1.gif');
height: 20px;
}
#sideNavHeader2 {
background-image: url('../elements/sideNavHeader2.gif');
height: 20px;
}
/******************* main headers *******************/
#midNavHeader {
background-image: url('../elements/midNavHeader.gif');
height: 20px;
}
thanks in advance... EDIT: oh yea... sideLine and mainLine are the two columns of content.
|
|
|
|