I'm new to HTML code but i was making a layout for our band myspace. When I finished I looked at in on Internet Explorer and saw that it was way off from it looked like on Fire Fox. If anyone could help me out on why this is happening and has any suggestions for what I should do to fix it, it would be greatly appreciated. Here's the code that I have right now if that helps any. <a href="http://www.msplinks.com/MDFodHRwOi8vZnJpZW5kcy5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1pbnZpdGUuYWRkZnJpZW5kX3ZlcmlmeSZmcmllbmRJRD0zODY1NTAzNjQ="> <div id=layer1 style="position:absolute; top:485; left:250; width:144; height:15; z-index:7; padding:5px; border: 000000 0px solid; background-color:000000; background-image:url(http://i245.photobucket.com/albums/gg48/xvansxskaterx/TMSaddus.jpg); layer-background-image:url(yourfilename.gif);"></div></a> <a href="http://www.msplinks.com/MDFodHRwOi8vbWVzc2FnaW5nLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPW1haWwubWVzc2FnZSZmcmllbmRJRD0zODY1NTAzNjQmTXlUb2tlbj0yYmNlZDcyNS02OGU5LTQ4N2EtOTllOS0zYjMwMDY1MGJhOTE="> <div id=layer1 style="position:absolute; top:460; left:249; width:144; height:15; z-index:7; padding:5px; border: 000000 0px solid; background-color:000000; background-image:url(http://i245.photobucket.com/albums/gg48/xvansxskaterx/TMSmessageus.jpg); layer-background-image:url(yourfilename.gif);"></div></a> <a href="http://vids.myspace.com/index.cfm?fuseaction=vids.showvids&friendID=386550364&n=386550364&MyToken=2bced725-68e9-487a-99e9-3b300650ba91"> <div id=layer1 style="position:absolute; top:435; left:250; width:144; height:15; z-index:7; padding:5px; border: 000000 0px solid; background-color:000000; background-image:url(http://i245.photobucket.com/albums/gg48/xvansxskaterx/TMSviewvideos.jpg); layer-background-image:url(yourfilename.gif);"></div></a> <a href="http://viewmorepics.myspace.com/index.cfm?fuseaction=user.viewAlbums&friendID=386550364"> <div id=layer1 style="position:absolute; top:410; left:250; width:144; height:15; z-index:7; padding:5px; border: 000000 0px solid; background-color:000000; background-image:url(http://i245.photobucket.com/albums/gg48/xvansxskaterx/TMSpics.jpg); layer-background-image:url(yourfilename.gif);"></div></a> <div id=layertoppicture style="position:absolute; top:240; left:250; width:218; height:160; z-index:6; padding:5px; border: 000000 0px solid; background-color:000000; background-image:url(http://i245.photobucket.com/albums/gg48/xvansxskaterx/TMSpicture.jpg); layer-background-image:url(yourfilename.gif);"></div> <div id=layernews style="position:absolute; top:1200; left:583; width:270; height:21; z-index:5; padding:5px; border: 000000 0px solid; background-color:000000; background-image:url(http://i245.photobucket.com/albums/gg48/xvansxskaterx/TMSnews2.jpg); layer-background-image:url(yourfilename.gif);"></div> <div id=layerblackblog style="position:absolute; top:1180; left:510; width:500; height:40; z-index:1; padding:5px; border: 000000 0px solid; background-color:000000; background-image:url(your desired image); layer-background-image:url(yourfilename.gif);"></div> <div id=layermembers style="position:absolute; top:650; left:250; width:122; height:77; z-index:5; padding:5px; border: 000000 0px solid; background-color:000000; background-image:url(http://i245.photobucket.com/albums/gg48/xvansxskaterx/TMSmembersdone.jpg); layer-background-image:url(yourfilename.gif);"></div> <div id=layersmallblack style="position:absolute; top:720; left:550; width:3; height:80; z-index:4; padding:5px; border: 000000 0px solid; background-color:000000; background-image:url(your desired image); layer-background-image:url(yourfilename.gif);"></div> <div id=layerinformationtext style="position:absolute; top:870; left:245; width:190; height:28;z-index:3; padding:5px; border: 000000 0px solid; background-color:none;"><pre><b><font face="Arial" font size="2">Myspace URL</font></b> <a href="http://www.myspace.com/themartyrsilhouette">myspace.com/themartyrsilhouette</a> <b><font face="Arial" font size="2">Hometown</font></b> <font face="Arial">Huron, SD</font> <b><font face="Arial" font size="2">Email</font></b> <a href="mailto:http://themartyrsilhouette@hotmail.com?subject= &CC= &body=">themartyrsilhouette@hotmail.com</a> <b><font face="Arial" font size="2">Management</font></b> <a href="http://www.myspace.com/chrisandjoy4ever">Sound Faith Music</a> <b><font face="Arial" font size="2">Booking</font></b> <a href="mailto:http://www.msplinks.com/MDFodHRwOi8vbWVzc2FnaW5nLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPW1haWwubWVzc2FnZSZmcmllbmRJRD0zODY1NTAzNjQmTXlUb2tlbj01NDQwNDJiMy0wNmIyLTQwNTEtYjg4NS0yMjljZTNlMjAxZGI=">Message Us</a> <font face="Arial">or</font> <a href="http://www.msplinks.com/MDFodHRwOi8vam9yZG9uQHNvdW5kZmFpdGhtdXNpYy5jb20=">Mail Jordon</a> <b><font face="Arial" font size="2">Label</font></b> <font face="Arial">None</font></pre></div> <div id=layerinformation style="position:absolute; top:850; left:250; width:290; height:21; z-index:3; padding:5px; border: 000000 0px solid; background-color:000000; background-image:url(http://i245.photobucket.com/albums/gg48/xvansxskaterx/TMSinformation1.jpg); layer-background-image:url(yourfilename.gif);"></div> <div id=layerleftblack style="position:absolute; top:210; left:250; width:300; height:900; z-index:1; padding:5px; border: 000000 0px solid; background-color:000000; background-image:url(your desired image); layer-background-image:url(yourfilename.gif);"></div> <div id=layershows style="position:absolute; top:600; left:580; width:407; height:26; z-index:2; padding:5px; border: 000000 0px solid; background-color:000000; background-image:url(http://i245.photobucket.com/albums/gg48/xvansxskaterx/TMSshows2.jpg); layer-background-image:url(yourfilename.gif);"></div> <div id=layerblackshows style="position:absolute; top:590; left:510; width:500; height:40; z-index:1; padding:5px; border: 000000 0px solid; background-color:000000; background-image:url(your desired image); layer-background-image:url(yourfilename.gif);"></div> <style type="text/css"> table td.text {visibility:hidden;} td.text td, td.text span, td.text a {visibility:visible;} </style> <style>body.bodyContent table tbody tr td table tbody tr td.text div {position:absolute; margin-left:-10px; top:620px;}</style> <style>td td embed, table div object {position:absolute; left:0px; top:-190px; z-index:2;}</style> <style type="text/css"> object {position:relative; top:0; left:-45px;} <style type="text/css"> { Created using CodeMyLayout.com Profile Editor } { Background Properties } table, tr, td { background-color:transparent; border:none; border-width:0;} body { background-color:none; background-image:url('http://i245.photobucket.com/albums/gg48/xvansxskaterx/TMSlayout4notexttweak.jpg'); background-attachment:fixed; background-position:top center; background-repeat:no-repeat; border-top-width:0px; border-bottom-width:0px; border-left-width:0px; border-right-width:0px; border-color:none; border-style:solid; padding-left:0px; padding-right:0px; } .CodeMyLayout.com { Table Properties } table table { border: 0px } table table table table{border:0px} table, tr, td { background-color:transparent; border:none; border-width:0;} table table table { border-style:double; border-width:0; border-color:00A2FF; background-color:000000; background-image:url('Enter Image URL'); background-repeat:repeat; background-attachment:fixed; background-position:top center; } table table table table td {filter:none;} { Text Properties } table, tr, td, li, p, div {font-family:tahoma !important; font-size:11px !important; color:01C17B !important; } .btext, .orangetext15, .nametext, .whitetext12 {font-family:tahoma !important; color:01C17B !important; font-weight:bold; font-style:normal; } .blacktext10, .blacktext11, .blacktext12, .lightbluetext8, .redtext, .redbtext, .text {color:01C17B !important; font-weight:bold; font-style:normal; } { Link Properties } a:active, a:visited, a:link {color:00A2FF !important; font-weight:normal; font-style:normal; } a:hover {font-weight:normal; font-style:normal; } { Tweaks } </style><div><a href=_blank"><a><a href=""_blank" style="font-size:13px"><b></b></a><br /><a href=target="_blank" style="font-size:13px"><b></b></a><br /><a href= target="_blank" style="font-size:13px"><b></b></a><br /><a href= target="_blank" style="font-size:13px"><b></b></a></div> Endorsements <span class="off">!-Start Block to Shift Comments To Center-!</span> <style> {!-Change the top px value as needed. This is distance B on the chart-!} table.friendscomments {position:relative; left:50%; left:-0px; top:900px;} table.friendscomments {width:450px !important;} table.friendscomments td, table.friendscomments table {width:100% !important} table.friendscomments table table td {width:auto !important;} </style> <span class="off">!-END Block to Shift Comments To Center-!</span> <span class="off">!-Start Block to Shift Comments To Center-!</span> <style> {!-Change the top px value as needed. This is distance B on the chart-!} table.friendspace {position:relative; left:50%; left:-150px; top:900px;} table.friendspace {width:450px !important;} table.friendspace td, table.friendscomments table {width:100% !important} table.friendspace table table td {width:auto !important;} </style> <span class="off">!-END Block to Shift Comments To Center-!</span> <span class="off">!-Start Block to Shift Comments To Center-!</span> <style> {!-Change the top px value as needed. This is distance B on the chart-!} table.latestblogentry {position:relative; left:50%; left:0px; top:940px;} table.latestblogentry {width:450px !important;} table.latestblogentry td, table.latestblogentry table {width:100% !important} table.latestblogentry table table td {width:auto !important;} </style> <span class="off">!-END Block to Shift Comments To Center-!</span> <style> {!-Change the top px value as needed. This is distance B on the chart-!} table.<span class="off">!-Start Block to Shift Comments To Center-!</span> <style> {!-Change the top px value as needed. This is distance B on the chart-!} table.musicianbio {position:relative; left:50%; left:-400px; top:600px;} table.musicianbio {width:450px !important;} table.musicianbio td, table.musicianbio table {width:100% !important} table.musicianbio table table td {width:auto !important;} </style>
The fact that it works in Firefox but not IE is a good sign because FF will show what you wrote while IE, well, you never know what that is going to do. IE is the worst browser on the planet. However, your biggest problem is going to be that myspace is a coding nightmare itself.
I know I have had the same problems when I started coding my own pages. but now I code for FF and put in a bug fix for IE. it is a real pain, however a necessary one.
Dude, you REALLY need to town down your rabid firefux fanboyism a little - as FF is almost as likely to be wrong since it too can be a complete ***tard about things like line-height, display:inline-block (think FF3 has it right? Try again), colgroups (nothing quite like a ten year old unresolved bugzilla entry), etc, etc. YES, IE is a trainwreck, but FF is no prize pig either. ----------------------------------------------------------- For the OP, as to the problem at hand if that was indeed the source to the page in question you need to take the time to go back and LEARN HTML. 1. You appear to be closing DIV that aren't opened 2. You appear to have DIV inside anchors which is completely invalid HTML. Anchors are inline-level, div's are block level... block-level elements can contain any other level element, inline-level can only contain CDATA or other inline-level elements. 3. You have your styling inlined in your markup - that **** should probably be offloaded to an external stylesheet. 4. I think you are using the STYLE tag inside the document body - this is invalid in strict doctypes and sloppy coding in valid ones (assuming you even have a doctype) Which is just the tip of the iceberg from what I'm seeing... Wierd spans for what should probably be comments? Do yourself a favor, forget EVERYTHING you've learned about HTML and CSS, and go grab a copy of Ian Lloyd's "Build your own website the right way"