Quote:
Originally Posted by eddie-executive
Here's the code for my index page
|
I started to go through your css file, but honestly it has so many mistakes it isn't possible for me to notice where the exact problem is. So I will try to just point out a few things, and you can go through and correct them to see if it works.
1) If you define margin and padding to 0 in the body, you don't have to define the zeros again.
2) margin: 0px 0px 0px 0px; should be margin: 0;
3) padding: 100px; is nothing
4) margin: 0 auto auto; should be margin: 0 auto; This is to center the margin spacing but doesn't always work correctly within other elements.
5) width: 100%; 100% widths can cause issues between ie and ff
6) margin: 0 0px 0px 0px !important; should be margin: 0 !important;
7) vertical-align doesn't work correctly in all browsers
8) font: 14px arial, sans-serif; should be font-family: Define it in the body so you only have to define it again when you want it changed.
9) background: Shouldn't have widths or spaces assigned
10) In margin and padding, you need to define all sides: margin: 10px 10px isn't correct, margin: 0 10px 0 10px is correct
.box {
margin: 0px 0px;
border-top: 1px solid #F3FDA4;
;
border-left: 1px solid #cccccc;
border-right: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
background: #F3FDA4;
}
Should be: You have an extra ; too
.box {
background: #F3FDA4;
background-image:none;
border-top: 1px solid #F3FDA4;
border-left: 1px solid #cccccc;
border-right: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
}
Trying to force full paddings or margins, or trying to align divs with margins/padding is where IE and FF get bitchy with each other.
Hope that helps, just some quick things that stood out to me.