how to make my page look just as good in IE as in Firefox? Options

[alexisb]

Apparently most of my friends still use internet explorer and i'm not loving the way my page looks in it. What tweaks would make it look just as good as it does in firefox? Here's the link:

http://myspace.com/griidlocked

Here are the codes.

CODE

<style>
.a {hides about and meet labels only}
.blurbs td td .orangetext15 {display:none;}
</style>
<style>
table.friendsComments img {max-width:340px}
*table.friendsComments {width:2000px; margin-right:-1565px;}
*table.friendsComments tr td.text table tr td table tr td {width:340px;}
*table.friendsComments img {width:100%;}
</style>
<style>
tr td tr td tr td tr td tr td {width:0px;padding:0px;}
table table table table td{width:0px;padding:0px;border:0px;}
span.lightbluetext8{display:none;}
</style>
<style>table, tr, td, .userprofileurl div{height:0%; border:0px!important; padding:0px!important; background-color:transparent;}

table, tr, td, body, marquee, textarea, input, form{cursor:default!important;}

body{background-color:202020; background-image: url(http://i69.photobucket.com/albums/i49/alexismyspace/lips.gif); background-attachment:fixed; background-repeat:repeat; text-align:center;background-position:bottom left;}

.latestblogentry br, .redtext, div td form,
table table td.text table td.text table table tbody td table, .orangetext15, table div div, .whitetext12, .text .text .orangetext15, .contacttable, .navigationbar span{display:visible;}

.blacktext10{ color:;font-size: 8pt;font-family: arial;line-height: 8px;letter-spacing:-2pxfont-weight: bold;text-decoration: none;text-transform: lowercase; }

.orangetext15{ color:;font-size: 8pt;font-family:arial;line-height: 8px;letter-spacing:pxfont-weight: bold;text-decoration: none;text-transform: lowercase;visibility:; }

.blacktext12{ color:;font-size: 8pt;font-family:arial;line-height: 8px;letter-spacing:pxcolor:;font-weight: bold;text-decoration: none;text-transform: lowercase; }

.navbar{visibility:visible;}
</style>


<style>



i {color: C2F9AF;font-family: georgia;font-size: 10pt;text-transform:;font-style:italic;font-weight: normal;}

b{ color: FE95C9;font-size: 7pt;font-family:arial;line-height: 10px;letter-spacing:pxcolor:;font-weight: bold;text-decoration: none;text-transform: uppercase; }

table{width:450px;}

u {color:;font-family: century gothic;font-size:pt;text-transform:;font-style: none;}.redtext,{ color: FE56A3;font-size: 8pt;font-family:arial;line-height: 11px; letter-spacing:pxfont-weight: bold;text-decoration: none;text-transform: lowercase; }

td{text-align:center}

.whitetext12 {font-family:arial; color:000000; font-size:8px; text-transform:lowercase; text-decoration:none; font-weight:normal; line-height:10px;}

.orangetext15 {font-family:arial; color:000000; font-size:8px; text-transform:lowercase; text-decoration:none; font-weight:normal; line-height:10px;}

.redtext {font-family:arial; color:FE95C9; font-size:8px; text-transform:lowercase; text-decoration:none; font-weight:normal; line-height:10px;}

textarea, input {font-family:arial; color:000000; font-size:8px; text-transform:lowercase; text-decoration:none; font-weight:normal; line-
height:10px; height:30px; width:200px; }

.redbtext {font-family:arial; color:000000; font-size:8px; text-transform:lowercase; text-decoration:none; font-weight:normal; line-height:10px;}

u {font-family:arial;font-size: 8px;line-height: 8px; letter-spacing:0px;font-weight:normal;color:000000;text-decoration: none; text-transform:lowercase;border-bottom-color:FE56A3; border-bottom-width: 3px; border-bottom-style: double;}

big {
font-family:tahoma;
font-size: 20pt;
line-height: 20pt;
letter-spacing:-1px;
font-weight: normal;
color: 000000;
text-decoration:underline;
text-transform:lowercase;
}

small {
font-family:arial;
font-size: 8px;
line-height: 8px;
letter-spacing:1px;
font-weight: normal;
color: 000000;
text-decoration:none;
text-transform:lowercase;
}

tr, td, div, font, strong, a, textarea, input, select, li, table, b, u, i{font-family:arial!important; font-size:9px!important; font-weight:normal!important; text-decoration:none!important; line-height:10px!important; text-transform:lowercase!important; color:black!important;}

table table{border:0px solid!important; border-color:black; background-color:transparent; background-image: url(); background-repeat:repeat; background-attachment:scroll;}

table table td{padding:2px!important;}

table table table td{text-align:center;}

div table{background-color:transparent; border:0px!important; background-image:none!important;}

table table table{background-color:ffffff!important; width:100%; border:1px solid!important; border-color:000000; padding:0px!important; background-image:none;} table table table table, table table table td{border:0px!important; padding:0px!important;}

.blurbs table{width:300px;}

body, td, li, p, div, textarea, li, h1, h2, p, br{color:000000; font-family:century gothic; font-size: 8pt; font-weight: normal;text-decoration:normal; line-height: 10px; letter-spacing:px}

.nametext{font-family:verdana;color:FE3C60;font-size:30px;letter-spacing:-3px;text-align:center;font-weight:bold;display:block; background-color: transparent;border-bottom-width: 1px;border-bottom-color:FFfff;border-bottom-style: solid;line-height: 30px;text-transform: lowercase; }

div td font{visibility:;}

a:hover{font-family:arial!important; font-size:12px!important; font-weight:normal!important; text-decoration:none!important; line-height:14px!important; text-transform:lowercase!important; letter-spacing:-1px!important; color:black!important;}

.text {color:000000; font-family: arial; font-size: 8pt; text-decoration:none; text-transform: lowercase;line-height: 10px; letter-spacing:px}

.lightbluetext8 {font-family:arial;font-size:10px;background-color:BBD25F; border:1px solid;border-color:A9C637;font-weight:normal;color:000000;text-transform:lowercase; width:100px;text-align:right;}

</style>

Thanks in advance!

Reason for edit: please put codes in codeboxes. thanks :) -natalia

[alexisb]

usually in IE you should add
the !important declaration after every line of CSS this seems to work for alot of people

so for example

CODE

left:15px !important;}

I'm not sure what you mean by adding the declaration after every line of CSS? Does this mean add !important to every line? Thanks

Reason for edit: double posting. the edit button is there for a reason ;)

[Nadiyya]

I'm not sure what you mean by adding the declaration after every line of CSS? Does this mean add !important to every line? Thanks
Specifically? I don't like that the comments pictures are so big in IE and the tables aren't even in IE as they are in firefox.

I think it's because you're using "max-width" for your comment images. Max-width isn't supported in IE.

So, for this

CODE

table.friendsComments img {max-width:340px}

just change it to this

CODE

table.friendsComments img {max-width:340px; _width:90px}

The underscore is only going to be read by IE. All the other browsers will read max-width.