IE problems

[C@L]

http://jaydio.supercoolhosting.com/calrowe/

Expands too far in IE =[

Any1 have an idea why its messing up?

thanX Cal

[brokenversion]

heres an answer get firefox :D www.firefox.com

[bmiz]

lol.....from my standpoint that is the only answer :D :D :D

free and better, so y not man? :P

[SaIRoS]

Your actual CSS:

body {

background-color:#c2c2c2;

background-image:url(images/main_bg.jpg);

background-repeat:repeat-x;

background-position:top;

font-size:10px;

font-family:Arial, Helvetica, sans-serif;

color:#91a0a7;

}



h1 {

font-size:16px;

margin:0px;

color:#6a757a

}



img {

border:none;

}



.main {

margin:0px;

position:absolute;

top:-1px;

margin-left:15%;

margin-right:15%;

}



.banner {

background-image:url(images/head_bg.jpg);

background-repeat:repeat-x;

height:171px;

width:100%;

margin:0px;

}



.content {

background-color:#e2e2e2;

margin-left:15px;

margin-right:15px;

height:60%;

background-image:url(images/copyright_image.jpg);

background-repeat:no-repeat;

background-position:bottom left;

}



.footer {

background-image:url(images/bottom_shadow.jpg);

height:38px;

margin-left:15px;

margin-right:15px;

}



.nav_top {

width:84px;

height:16px;

background-color:#c8cdcf;

border-bottom:#f8f8f8 solid 1px;

border-left:#f0f0f0 solid 1px;

border-right:#f0f0f0 solid 1px;

border-top:#4d4e50 solid 1px;

background-image:url(images/nav_top_bg.jpg);

background-position:top right;

background-repeat:no-repeat;

color:#6a757a;

font-weight:bolder;

font-size:18px;

padding-top:15px;

padding-bottom:2px;

position:absolute;

left:25px;

top:181px;

padding-left:5px;

}



.nav {

width:84px;

background-color:#c8cdcf;

border-bottom:#f8f8f8 solid 1px;

border-left:#f0f0f0 solid 1px;

border-right:#f0f0f0 solid 1px;

border-top:#4d4e50 solid 1px;

background-image:url(images/nav_bg.jpg);

background-position:top right;

background-repeat:no-repeat;

color:#91a0a7;

font-size:18px;

padding-top:15px;

padding-bottom:2px;

position:absolute;

left:25px;

top:225px;

padding-left:5px;

}



.main_content {

height:50%;

background-color:#c8cdcf;

border-bottom:#f8f8f8 solid 1px;

border-left:#f0f0f0 solid 1px;

border-right:#f0f0f0 solid 1px;

border-top:#4d4e50 solid 1px;

background-image:url(images/main_content_bg.jpg);

background-position:top right;

background-repeat:no-repeat;

color:#91a0a7;

font-size:10px;

padding-top:15px;

padding-bottom:2px;

padding-left:5px;

position:absolute;

left:125px;

top:181px;

right:30px;

}


try to change it to this:

body {

background-color:#c2c2c2;

background-image:url(images/main_bg.jpg);

background-repeat:repeat-x;

background-position:top;

font-size:10px;

font-family:Arial, Helvetica, sans-serif;

color:#91a0a7;

}



h1 {

font-size:16px;

margin:0px;

color:#6a757a

}



img {

border:none;

}



.main {

margin:0px;

position:absolute;

top:-1px;

margin-left:15%;

margin-right:15%;

}



.banner {

background-image:url(images/head_bg.jpg);

background-repeat:repeat-x;

height:171px;

width:60%;

margin:0px;

}



.content {

background-color:#e2e2e2;

margin-left:15px;

margin-right:15px;

height:60%;

width: 60%;

background-image:url(images/copyright_image.jpg);

background-repeat:no-repeat;

background-position:bottom left;

}



.footer {

background-image:url(images/bottom_shadow.jpg);

height:38px;

width: 60%;

margin-left:15px;

margin-right:15px;

}



.nav_top {

width:84px;

height:16px;

background-color:#c8cdcf;

border-bottom:#f8f8f8 solid 1px;

border-left:#f0f0f0 solid 1px;

border-right:#f0f0f0 solid 1px;

border-top:#4d4e50 solid 1px;

background-image:url(images/nav_top_bg.jpg);

background-position:top right;

background-repeat:no-repeat;

color:#6a757a;

font-weight:bolder;

font-size:18px;

padding-top:15px;

padding-bottom:2px;

position:absolute;

left:25px;

top:181px;

padding-left:5px;

}



.nav {

width:84px;

background-color:#c8cdcf;

border-bottom:#f8f8f8 solid 1px;

border-left:#f0f0f0 solid 1px;

border-right:#f0f0f0 solid 1px;

border-top:#4d4e50 solid 1px;

background-image:url(images/nav_bg.jpg);

background-position:top right;

background-repeat:no-repeat;

color:#91a0a7;

font-size:18px;

padding-top:15px;

padding-bottom:2px;

position:absolute;

left:25px;

top:225px;

padding-left:5px;

}



.main_content {

height:50%;

background-color:#c8cdcf;

border-bottom:#f8f8f8 solid 1px;

border-left:#f0f0f0 solid 1px;

border-right:#f0f0f0 solid 1px;

border-top:#4d4e50 solid 1px;

background-image:url(images/main_content_bg.jpg);

background-position:top right;

background-repeat:no-repeat;

color:#91a0a7;

font-size:10px;

padding-top:15px;

padding-bottom:2px;

padding-left:5px;

position:absolute;

left:125px;

top:181px;

right:30px;

}


Anyways, I am pretty sure your problem is the width in the content, banner, footer classes. Look there :P

[geepee]

WWW.GETFIREFOX.COM !!!

[SaIRoS]

firefox is not the best solution, we all know that IE is a biig b--ch when you code a page but it shows you that you did something wrong. And a lot of people still use IE so you can just write GET FIREFOX :P

[geepee]

but we also all know that firefox is ONE OF THE BEST solutions :D

[C@L]

firefox is not the best solution, we all know that IE is a biig b--ch when you code a page but it shows you that you did something wrong. And a lot of people still use IE so you can just write GET FIREFOX :P
[/b]

I dont think its that if you code for IE then you code right

Its more IE doesnt handle CSS properly, and thats why theres problems