IE displays distorted version of my forum

Xatyrn · 02-23-2011, 09:21 PM

Okay, I own an InvisionFree forum and am having some coding issues--the support forum for InvisionFree isn't helping, so I decided to come here.
For Firefox and Chrome, my forum is viewed perfectly fine, but for IE users, the whole site is horribly deformed, with almost everything aligned far to the left and stretched out, etc.

The problem lies either within the CSS,

Code:

html { overflow-x: auto; overflow-y: auto; }

form { display:inline; }
img ï¿½{ vertical-align:middle; border:0px }
BODY { font-family: Tahoma, Verdana, sans-serif; font-size: 10px; color: #555555; margin:10px 10px 10px 10px;background-color:#D3D3D3; background-image: url(http://209.85.48.10/12851/36/upload/p238258.jpg); }
TABLE, TR, TD { font-family: Tahoma, Verdana, sans-serif; font-size: 10px; color: #999999; }
a:link, a:visited, a:active { text-decoration: none; color: #47A1B4 }
a:hover { color: #1F95B5; text-decoration:underline }

fieldset.search { padding:6px; line-height:150% }
label { cursor:pointer; }

img.attach { border:2px outset #EEF2F7;padding:2px }

.googleroot ï¿½{ padding:6px; line-height:130% }
.googlechild { padding:6px; margin-left:30px; line-height:130% }
.googlebottom, .googlebottom a:link, .googlebottom a:visited, .googlebottom a:active { font-size:11px; color: #3A4F6C; }
.googlish, .googlish a:link, .googlish a:visited, .googlish a:active { font-size:14px; font-weight:bold; color:#00D; }
.googlepagelinks { font-size:1.1em; letter-spacing:1px }
.googlesmall, .googlesmall a:link, .googlesmall a:active, .googlesmall a:visited { font-size:10px; color:#434951 }

li.helprow { padding:0px; margin:0px 0px 10px 0px }
ul#help ï¿½ ï¿½{ padding:0px 0px 0px 15px }

option.cat { font-weight:bold; }
option.sub { font-weight:bold;color:#555 }
.caldate ï¿½ { color: #FFFFFF; text-align:right; font-weight:bold; font-size:10px; background-color:#C4C4C4;padding:4px;margin:0px }

.warngood { color:green }
.warnbad ï¿½{ color:red }

#padandcenter { margin-left:auto; margin-right:auto; text-align:center; padding:14px 0px 14px 0px }

#profilename { font-size:28px; font-weight:bold; line-height: 150% }
#calendarname { font-size:22px; font-weight:bold; }

#photowrap { padding:6px; }
#phototitle { font-size:24px; border-bottom:1px solid black }
#photoimg ï¿½ { text-align:center; margin-top:15px }

#ucpmenu ï¿½ ï¿½{ line-height:150%; width:22%; border:1px dashed #C4C4C4; background-color: #F0F0F0 }
#ucpmenu p ï¿½{ padding:2px 5px 6px 9px;margin:0px; }
#ucpcontent { background-color: #F0F0F0; border:1px dashed #C4C4C4;line-height:150%; width:auto }
#ucpcontent p ï¿½{ padding:10px;margin:0px; }

#ipsbanner { position:absolute;top:1px;right:5%; }
#logostrip { background-color: #EEEEEE; }

#submenu ï¿½ { background-color: #F3F3F3; border: 1px solid #D3D3D3; }
#submenu img { display: none; }
#userlinks { background-color: #F3F3F3; border: 1px solid #D3D3D3; }

#navstrip ï¿½{ font-weight:bold;padding:6px 0px 6px 0px; }

.activeuserstrip { background-color:#D3D3D3; padding:3px 4px 3px 4px; color: #555555; margin: 1px; border-top: 1px dotted #FFFFFF; }
.activeuserstrip a { color: #999999; text-decoration: none; }
.activeuserstrip a:hover { color: #555555; text-decoration: underline; }

.pformstrip { background: #47A1B4; padding: 0px 3px 0px 3px; color: #FFFFFF; font-weight: normal; font-size: 9px; }
.pformstrip a { color: #FFFFFF; text-decoration: none; }
.pformstrip a:hover { color: #FFFFFF; text-decoration: underline; }
.pformleft ï¿½{ background-color: #F0F0F0; padding: 6px; margin-top: 1px; border: 1px solid #C4C4C4; border-bottom:none; }
.pformim { background-color: #666666; border: 1px solid #131313; }
.pformleftw { background-color: #F0F0F0; padding:6px; margin-top: 1px; border: 1px solid #C4C4C4; border-bottom: none; }
.pformright { background-color: #F0F0F0; padding:6px; margin-top: 1px; border-top: 1px solid #C4C4C4; ï¿½}

.post1 { background-color: #F0F0F0; color: #000000; }
.post1 a { color: #47A1B4 }
.post1 a:hover { color: #999999; text-decoration: none;}
.post2 { background-color: #F0F0F0; color: #000000; }
.post2 a { color: #47A1B4 }
.post2 a:hover { color: #999999; text-decoration: none;}

.postlinksbar { background: #47A1B4; padding: 1px 3px 1px 3px; color: #FFFFFF; font-size: 10px; }
.postlinksbar a { color: #FFFFFF; text-decoration: none; }
.postlinksbar a:hover { color: #000000; text-decoration: none; }

.row1 { background-color: #F0F0F0; border: 1px solid #FFFFFF; }
.row2 { background-color: #F0F0F0; border: 1px solid #FFFFFF; }
.row3 { background-color: #F0F0F0; border: 1px solid #FFFFFF; }
.row4 { background-color: #F0F0F0; border: 1px solid #FFFFFF; }

.row4 div.row4 {border: none! important}
div.row4 {border-color: #D3D3D3; border-right: 1px solid #D3D3D3; border-bottom: 1px solid #D3D3D3!important; border-top: 1px solid #999999!important; border-left: 1px solid #999999!important; }
div.row4 {border-color: #D3D3D3!important; background-color: #F3F3F3;}

.darkrow1 { background-color: #EEEEEE; }
.darkrow2 { background-color: #47A1B4; padding: 0px; height: 9px; border-top: 1px dotted #FFFFFF; font-size: 9px }
.darkrow3 { background-color: #F0F0F0 }

.hlight { background-color: #E5E5E5 }
.dlight { background-color: #F0F0F0 }

.titlemedium { background-color: #47A1B4; padding: 0px 3px 0px 3px; color: #FFFFFF; font-weight: normal; font-size: 9px; border-bottom: 1px dotted #FFFFFF; }
.titlemedium a { color:#FFFFFF; text-decoration: none; }
.titlemedium a:hover { color:#FFFFFF; text-decoration: underline; }

.maintitle { font-family: courier new, courier, serif; color: #47A1B4; text-align: right; padding: 1px 2px 8px 2px; background: #EEEEEE url(http://209.85.48.10/12851/36/upload/p237706.jpg) bottom right repeat-x; font-size: 18px; font-weight: normal; text-transform: lowercase; letter-spacing: 3px; border-bottom: 1px dotted #47A1B4; }
.maintitle img { display: none }
.maintitle a { text-decoration: none; color: #47A1B4; }
.maintitle a:hover { text-decoration: none; color: #666666 }

.plainborder { border:none; background-color: #D3D3D3; padding:0px;}
.tableborder { border:none;background-color:#D3D3D3; padding:0px; width:100%; align: left; }
.tablefill { padding: 5px; background-color: #EEEEEE; border: 1px dotted #A4A4A4; }
.tablepad { background-color: #EEEEEE; padding: 6px; border: 1px dotted #C4C4C4; }
.tablebasic ï¿½{ width: 100%; padding: 0px 0px 0px 0px; margin: 0px; border: 0px }

div.tableborder div.tablepad { background-color: #F0F0F0!important; }
div.tableborder div.tablepad ï¿½table { background-color: #EEEEEE!important; }
div.tableborder div.tablepad input { color: #666666!important; background-color: #F0F0F0!important; border: 1px solid #C4C4C4; }

.wrapmini ï¿½ ï¿½{ float: left; }
.pagelinks ï¿½ { float: left; }

.desc { font-size: 10px; color:#000000; }
.edit { font-size: 9px }

.signature ï¿½ { font-size: 10px; color: #999999 }
.postdetails { color: #000000; font-size: 10px }
.postcolor ï¿½ { font-size: 10px; line-height: 160% }

.normalname { font-size: 12px; font-weight: bold; color: #003 }
.normalname a:link, .normalname a:visited, .normalname a:active { font-size: 12px }
.unreg { font-size: 11px; font-weight: bold; color: #900 }

.searchlite { font-weight:bold; color:#F00; background-color:#FF0 }

#QUOTE { font-size: 8px; font-family: Tahoma, Verdana, sans-serif; color: #333333; vertical-align: middle; background-color: #EEEEEE; padding: 4px; border: 1px dashed #BBBBBB; ï¿½}
#CODE ï¿½{ font-size: 8px; font-family: Verdana, Tahoma, sans-serif; color: #666666; letter-spacing: 1px; vertical-align: middle; background-color: #EEEEEE; padding:4px; border: 1px dashed #BBBBBB; }

.copyright { font-family: Tahoma, Verdana, sans-serif; font-size: 10px; line-height: 12px; }


.codebuttons { font-size: 10px; font-family: Arial, Tahoma, sans-serif; background:#F0F0F0; color:#999999; margin:1px; border: 1px solid #C4C4C4; }

.radiobutton, .checkbox ï¿½{ font-size: 10px; background: #F0F0F0; ï¿½color: #888888; margin: 1px; border: 1px solid #C4C4C4; }
.forminput, .textinput { font-size: 11px; font-family: Tahoma, Verdana, sans-serif; vertical-align: middle; color: #666666; background-color: #F0F0F0; padding: 2px; border: 1px solid #C4C4C4; }

.thin { padding: 2px 3px 2px 3px; line-height: 160%; margin: 2px 0px 2px 0px; background-color: #F0F0F0; border-top: 1px dotted #FFFFFF; border-bottom: 1px dotted #FFFFFF; }

#ipbwrapper { width: 930px; margin-left:auto; margin-right:auto; border: 8px solid #47A1B4 }

.maintable { background: #EEEEEE; width: 930px; padding: 10px; border: 8px solid #47A1B4; }
.mimmy { font-size: 10px; color: #666666; }
.sbtitle { font-family: courier new, courier, serif; color: #47A1B4; text-align: right; padding: 4px 2px 10px 2px; background: #EEEEEE url(http://209.85.48.10/12851/36/upload/p237706.jpg) bottom right repeat-x; font-size: 14px; font-weight: normal; text-transform: lowercase; letter-spacing: 3px; border-bottom: 1px dotted #FFFFFF; }
.sbcontent { background-color: #EEEEEE; color: #454545; padding: 6px; border: 1px dotted #47A1B4; }
.sbcontent a { color: #999999 }
.sbcontent a:hover { color: #000000; text-decoration: none; }

.purple { color:purple;font-weight:bold }
.red ï¿½ ï¿½{ color:red;font-weight:bold }
.green ï¿½{ color:green;font-weight:bold }
.blue ï¿½ { color:blue;font-weight:bold }
.orange { color:#F90;font-weight:bold }

OR the headers/footers

Code:

<table class="maintable" align="center">
<tr>
<td style="padding: 10px;">
<% BOARD HEADER %>
<% NAVIGATION %>


<center><font color='00000' size=4><b>PLEASE NOTE:
<br/>
<font size=3>Those viewing the forum with Internet Explorer are most likely seeing a horribly distorted version of the site; we are currently working on this problem, so please have patience!
THANK YOU.</b></font></center>

<br/>

<table width="100%" class='0' cellspacing="5" cellpadding="1">
<tr>
<td width="210" class='0' valign="top">
<% BOARD %>
<% STATS %>





<table id="titlemedium" cellspacing="1" width="468" class="tableborder"><tr><td align="center" valign="middle" class="row2" width="50%">Static</td>

<td align="center" valign="middle" class="row2" width="50%">Scroll</td></tr>

<tr><td align="center" valign="middle" class="row2" width="50%">

<a href="http://bleachsocietyrp.proboards.com/index.cgi"><img src="http://i1021.photobucket.com/albums/af334/rob1418/Untitled-4-11.png" width="88" height="31" border="0" alt="The Bleach Society Role-Play"></a>

<a href="http://sordidsecrets.proboards.com/index.cgi?"><img src="http://i55.tinypic.com/34quuxi.png" border="0" height="31" width="88" alt="SORDID SECRETS"></a>

<a href="http://finaldistance.proboards.com/index.cgi"><img src="http://i9.photobucket.com/albums/a52/RynxEnvy/fdaf2.png" border=0 title="Final Distance: AU Kingdom Hearts"></a>



<a href="http://www.justlikemagicv2.proboards.com" target="_blank"><img src="http://i51.tinypic.com/4i0pk9.jpg" border="0" width="88" height="31" alt="Just Like Magic"></a>


<a href="http://flickeringsouls.proboards.com"><img src="http://i22.photobucket.com/albums/b326/demon_tiger_wolf/FSaffiebannercopy.png" border="0" /></a>



<a href="http://indigofta.proboards.com/"><img src="http://i56.tinypic.com/14n0okg.jpg" border="0" alt=''></a>



<a href="http://bittersweetforever.com" Target="_blank"><img src="http://i672.photobucket.com/albums/vv86/KimberleeShantel/A%20Bittersweet%20Forever/BSF%20Buttons/bsf2small.jpg" width=88 height=31 border=0 alt="Bittersweet Forever"></a>



<a href="http://z15.invisionfree.com/writersretreat/index.php?showtopic=29"><img src="http://img109.imageshack.us/img109/8561/194051404428957665.jpg" alt="" border='0'></a>




</td>
<br />
<br />
<td align="center" valign="middle" class="row2" width="50%"><marquee scrollamount=5 onMouseover="this.scrollAmount=2" onMouseout="this.scrollAmount=5" width="100%" height="32" style="filter:alpha(opacity=100 finishopacity=0, style=1, startx=35, starty=0, finishx=0, finishy=0)">

<a href="http://z8.invisionfree.com/callmybluff"><img src="http://i42.tinypic.com/e9yt1d.png" border='0'></a>

<a href="http://z15.invisionfree.com/Rayvens_Reign/index.php?act=idx" target="_blank"><img src="http://i62.photobucket.com/albums/h116/TheMindWanderer/rrrrrrrrrrrr.png" border="0" alt="Rayven's Reign: A  Fantasy Roleplaying Forum"></a>

<a href="http://synthetictruth.net" target="_blank" title="a home for writers"><img src="http://synthetic-truth.net/ads/88x31.jpg" border='0'></a>

<a href="http://whenyoulive4ever.proboards.com/index.cgi" target="_blank"><img src="http://img528.imageshack.us/img528/4377/weyeani.gif" alt="Twilight Moments" width="88" height="31" border="0" /></a>

<a href="http://www.ofagewizards.com"><img src="http://i62.photobucket.com/albums/h118/Sandrunner12/consular.gif" border=0></a>


<a href="http://www.advertiseyoursite.net" target="_blank"><img src="http://images.jmnetwork.co.uk/advertiseyoursiteaffiliate.png" alt="Advertise Your Site" title="Advertise Your Site" border="0" /></a>

<a href="http://torrenta.proboards.com/index.cgi"><img src="http://i48.tinypic.com/fw5auc.jpg" border="0"></a>

<a href="http://creativemusesociety.thecreationcorner.net"><img src="http://i964.photobucket.com/albums/ae123/JediKnightMuse/CreativeMuseSociety/5zskqw.gif" border='0'></a>

<a href="http://www.inthemidnighthourx.proboards.com/index.cgi"><img src="http://i56.tinypic.com/o6y1zo.jpg" border="0" width="88" height="31" alt="IN THE MIDNIGHT HOUR"></a>  

<a href="http://kingdomcontained.proboards.com/index.cgi" target="_blank"><img src="http://i55.tinypic.com/91b2p5.jpg" alt="KingdomContained" border=”0”/></a>

<a href="http://www.hungergamesrpg.com/" target="_blank"><img src="http://i43.tinypic.com/whhc0o.jpg" border="0"></a>

<a href="http://plaguedworld.proboards.com/" target="_blank"><img src="http://img90.imageshack.us/img90/5789/plaguedminibanner.jpg" border="0" height=31 width=88 alt="PLAGUED"></a>

<a href="http://avengersassemble-rpg.proboards.com/index.cgi"><img src="http://i578.photobucket.com/albums/ss225/OdinBorson/AA/AvengersAssembleButton.gif" border="0"></a>

<a href="http://www.oeots.com/asf"><img src="http://i39.tinypic.com/1zwi0ro.jpg" border="0"></a>


<a href="http://asersmia.com/twenty-thirteen/index.php" target="_blank"><img src="http://i49.tinypic.com/35bzhwj.jpg" alt="Twenty/Thirteen: OC Modern Fantasy RPG" border='0'></a>

 <a href="http://pokemonanrui.proboards78.com"><img src="http://i170.photobucket.com/albums/u247/reesix/new/alt/anpichu.gif" title="Pokemon Anrui" Border="0"></a>

<a href="http://theeternallybeloved.com/index.php?"><img src="http://i863.photobucket.com/albums/ab195/Champagneheart/button1.png" border="0"></a>

<a href="http://theultimatexmen.proboards26.com" Target="_blank">
<img
src="http://i292.photobucket.com/albums/mm16/littler4bbit/MRO/mrobanner5.jpg"
width=88 height=31 border=0 alt="Mutant Revolution Online"></a>


<a href="http://ghabc.proboards.com/" target="_blank"><img src="http://i45.tinypic.com/2cpu654.jpg" border="0" title="BLEEDING LOVE;;"></a>


<a href="http://oeots.com/twistedkisses/index.php"><img src="http://i216.photobucket.com/albums/cc176/MoonGazer07/twistedkisses-3.png" border="0" alt="TWISTED KISSES - slave && master">

<a href="http://lastresortx.proboards.com" target="_blank"><img src="http://i43.tinypic.com/1zx021c.jpg" border="0" alt="Last Resort: an AU HP RPG"></a>

<a href="http://openbooksociety.com/" Target="_blank"><img src="http://i604.photobucket.com/albums/tt128/BitterSweetForeverr/6z4t1z_th.jpg" width=88 height=31 border=0 width=88 height=31 alt="Open Book Society"></a>



<a href="http://z15.invisionfree.com/writersretreat/index.php?showtopic=29"><img src="http://img109.imageshack.us/img109/8561/194051404428957665.jpg" border='0'></a>

</marquee></td></tr></table>

Code:

<script>
//Remove Forum Led by
//By slayer766 of thecodingzone.com

var obj = document.getElementsByTagName("span");
for(gone=0;gone<obj.length;gone++){
if(obj[gone].className=="desc" && obj[gone].innerHTML.match(/Forum Led by: (.*)/i)){
obj[gone].innerHTML=obj[gone].innerHTML.replace("Forum Led by: "+RegExp.$1,"");}}
</script>

<script type="text/javascript"><!--
/* Subforum Listing v.001
Created by ( Beta | UnwantedSuperHero )
This code may not be rehosted, redistributed, or modified without the creator's permission. */
document.write("<scr" + "ipt type='text/javascript' src='http://209.85.12.231/11008/57/upload/p1760407.ibf'>" + "</scr" + "ipt>");
//--></script>







<center>
<A HREF="http://www.copyscape.com/online-plagiarism/"><IMG SRC="http://banners.copyscape.com/images/cs-wh-3d-234x16.gif" ALT="Protected by Copyscape Online Plagiarism Check" TITLE="Protected by Copyscape Plagiarism Checker - Do not copy content from this page." WIDTH="234" HEIGHT="16" BORDER="0"></A>
</center>


<center><!-- Start FreeOnlineUsers.com -->
<font color=#47BCDC><script type="text/javascript" src="http://st1.freeonlineusers.com/on3.php?id=373919"> </script> currently viewing site</font></a>
<!-- End FreeOnlineUsers.com -->
</center>

Note that in the headers/footers I have an affiliate table set up, etc.
This is a recent issue, and the only thing I have been editing lately is the headers/footers...
If ANYONE can help me out here, I'd be so thankful. We're new, and I know this is preventing us from getting some members. XD

teedoff · 02-23-2011, 09:25 PM

Do you have a live site so we can view it?

Xatyrn · 02-23-2011, 09:33 PM

http://z15.invisionfree.com/writersretreat/

That. XD

teedoff · 02-23-2011, 11:48 PM

Seems you have some serious markup errors. Try validating your code here.

FIrst thing is you dont specify a valid doctype. Then I dont see an opening <body> tag, unless I missed it. IE is very picky when it comes to valid markup, so some of that is probably causing your issues. Try to work through those validation errors and fix all that you can. Then see how your page looks in IE.