IE vs Firefox---Big Difference PLs Help\!!!!

[malmus]

So I created this website--http://217.68.153.18/$sitepreview/methode-eur.com/ and in Internet Explorer it is being displayed perfect. When i show it in FIrefox I am having big problem. Can you please help me out? I can also display the css if you want!!

[radcaesar]

Whats ur problem ? I Was unable to access that url from my FF.

[malmus]

it is better if you go in the site to understand what is happening. If you copy and paste the link should work

http://217.68.153.18/$sitepreview/methode-eur.com/

[kunal pawar]

yes this problem of css can u post ur css and classes. so ur expert can resolve ur problem

[malmus]

[code=css]
#main
{
position: relative;
display: table;
width: 1000px;
}
#leftDiv
{
display: table-cell;
float: left;
width: 79px;
height: 528px;
background: url(../images/back_left.gif) top left no-repeat;
}
#mapContainer
{
position: relative;
width: 456px;
height: 369px;
background: url(../images/map.gif) top left no-repeat;
}
#mainDiv
{
position: relative;
display: table-cell;
float: left;
background: url(../images/back_maindiv.gi f) top left no-repeat #fefefe;
width: 842px;
height: 600px;
}
#rightDiv
{
display: table-cell;
float: left;
width: 79px;
height: 528px;
background: url(../images/back_right.gif) top left no-repeat;
}
#menuBar
{
position: relative;
left: 15px;
top: 235px;
background: url(../images/back_menu.jpg) top center no-repeat;
width: 187px;
height: 269px;

}
#search
{
display: block;
position: absolute;
width: 183px;
height: 53px;
top: 275px;
left: 0px;
background-color: #e5e9f1;
}
#topbar
{
position: absolute;
left: 2px;
top: 90px;
}
#topMenu
{

position: absolute;
right: 2px;
top: 47px;
text-align: right;
height: 41px;
}
#menuShadowLeft
{
position: absolute;
left: 83px;
top: 255px;
}
#menuShadowRigh t
{
position: absolute;
left: 281px;
top: 255px;
}
#footer
{
display: table-row;
position: relative;
width: 931px;
height: 10px;
background: url(../images/back_footer.gif ) top left no-repeat;
}
#footerShadow
{
position: absolute;
left: 921px;
top: -90px;
}
#bottom
{
display: block;
position: relative;
width: 931px;
height: 30px;
background: url(../images/back_bottom.gif ) top left no-repeat;
}
#utilityLinks
{
position: absolute;
right: 12px;
top: 15px;
text-align: right;
}
#logo
{
position: absolute;
left: 12px;
top: 45px;
}
#bodyDiv
{
position: relative;
display: table-cell;
float: left;
left: 220px;
width: 720px;
height: 450px;
top: 0px;


}

#innerDiv
{
display: table-cell;
float: left;
height: 300px;
width: 400px;

}
#innerDivFull
{
display: inline;
float: left;
height: 300px;
width: 600px;
}
#imageDiv
{

display: inline;
float: left;
width: 225px;
height: 100px;
padding-left: 5px;
vertical-align:top;
}
#imageDivOff
{
display: none;
}
#submenuDiv
{
display: inline;
float: left;
width: 220px;

padding-left:20px;
}
#MainImageDiv
{
display: inline;
float: left;
position:absolu te;
width: 220px;
left:-15px;
top:-15px;

padding-left:20px;
}

#submenuDivOff
{
display: none;
float: left;
border: 1px solid blue;
width: 150px;
margin-left: 5px;
}
[/code]

[Plater]

Be lucky that drhoward as not found this yet.
I would first suggest you fix your HTML errors seen here: http://validator.w3.org/check?uri=ht...Inline&group=0

Then move on to fixing your CSS errors here:

http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2F217.68.153.18%2F%24sitepreview%2Fmethode-eur.com%2F&warning=1&profile=css21&usermedium=all

[malmus]

Thanks for that. I didnt know about that website. Ill arrange them and get back to you. btw who is drhoward?

[Plater]

Thanks for that. I didnt know about that website. Ill arrange them and get back to you. btw who is drhoward?

Hehe: A fellow who hates IE very much

[malmus]

If I arrange all the errors that are being shown there then the VS.net will not run as it gives me an error. Should I arrange them still and try to run the vs?

[Plater]

If you correct your errors, the website should not have a problem running.

[drhowarddrfine]

Be lucky that drhoward as not found this yet.

Found it! Phew!

In addition to the html and css errors mentioned, your doctype is incomplete and puts IE into quirks mode. IE will never attempt to pretend it's a modern browser without a proper one. See the article about doctypes under Howtos above in the html/css section. (This is a html/css question but I'm not territorial :) )

You should be testing your page in Firefox or Opera or Safari first. Then you know your markup is correct and should work in all browsers. Then you can move onto old, buggy non-standard IE to see how it butchers the page. But IEs quirks and bugs are known as are the hacks to fix it.