Some weird layout problem with firefox 3.0.5

Xyphon · January 21, 2009

Here is my source code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<body>
<head>
<style type='text/css'>
a:link {
color:#000000;
text-decoration:none;
font-weight:bold;
}

a:visited {
color:#000000;
text-decoration:none;
font-weight:bold;
}
table {
border-collapse: collapsed;
}

a:hover {
border:1px dashed #000000;
padding-left:5px;
padding-right:5px
}

body {
width:750px;
margin:0px auto;
background:#C0C0C0;
}

#banner {
border:1px solid #000000;
width:748px;
height:148px;
float:left;
background:#5C5C5C;
}

#quicklinks {
border:1px solid;
border-top:0px;
float:left;
width:738px;
padding:0px 5px 0px 5px;
background:#5C5C5C;
}

#leftmenu {
float:left;
width:128px;
border:1px solid #000000;
border-top:0px;
padding:5px;
background:#5C5C5C;
}

#leftmenu ul {
margin:0;
padding:0;
list-style-type:none;
}

#leftmenu li {
font-weight:bold;
font-variant:small-caps;
padding:0px 2px;
font-size:medium;
letter-spacing:1px;
}

#leftmenu li ul li {
font-weight:normal;
background:transparent;
padding:0px 8px;
font-size:x-small;
font-variant:normal;
letter-spacing:0px;
}

#content {
float:left;
width:386px;
border:1px solid #000000;
margin:5px;
padding:5px;
background:#5C5C5C;
}

#rightmenu {
float:left;
border:1px solid #000000;
border-top:0px;
padding:5px;
width:190px;
background:#5C5C5C;
}

#rightmenu ul {
margin:0;
padding:0;
list-style-type:none;
}

#rightmenu li {
font-weight:bold;
font-variant:small-caps;
padding:0px 2px;
font-size:medium;
letter-spacing:1px;
}

#rightmenu li ul li {
font-weight:normal;
background:transparent;
padding:0px 8px;
font-size:x-small;
font-variant:normal;
letter-spacing:0px;
}

textarea {
background:#FFFFFF;
width:100%;
height:200px;
}

#footer {
width:386px;
border:1px solid #000000;
margin-left:145px;
float:left;
padding:5px;
background:#5C5C5C;
}
</style>
</head>
<title>Naruto Palace RPG</title>

<body>
<div id='banner'><img src='http://img164.imageshack.us/img164/2232/1232399406mq9.png'></div>
<div id='quicklinks'></div>
<div id='leftmenu'>
<ul>
<li>Main

<ul>
<li><a href='index.php'>Home</a></li>
<li><a href='login.php'>Login</a></li>
<li><a href='register.php'>Register</a></li>
</ul>
</li>
</ul></div>
<div id='content'>
</html>
Content
<html>
<p></p>
<table width='386' border='2' bordercolor='black'><td>Naruto Palace is Copyright 2008 all rights reserved. Naruto Palace is in no way affiliated with the creators of Naruto, or any of their affiliates.</td></table>

</div>
<div id='rightmenu'>
<ul>
<li>Main
<ul>
<li><a href='index.php'>Home</a></li>
<li><a href='login.php'>Login</a></li>
<li><a href='register.php'>Register</a></li>
</ul>
</li>
</ul>
</div>


</html>

Before I tell you the error, I have to tell you something else. For some reason, only some computers(Out of 3 computers only mine) have this problem. I have no idea why...

Basically, on firefox 3.0.5, the right menu goes to the left side, and below the content. I do not know why, and it's only on some computers. Other computers have it set up properly. Or, if im on any other version of firefox it works.

Tell me if there is something I should fix in here that might fix the problem.

Thank you.

EDIT: Oh yeah, forgot, on my other host it worked fine, so it might have something to do with the php version (but its still an html problem)

haku · January 22, 2009

Well your code is all messed up. You have a random opening body tag after your opening html tag, your title tag is between the head and the body, and you have a random closing and opening html tag in the middle of your body.

These kind of things screw up browsers. Its inconsistent, because each browser and version will deal with errors in its own way, and you have some pretty serious errors.

Xyphon · January 24, 2009

Not random, I close it for the content...

haku · January 24, 2009

Sorry, I should have said 'wrong', not 'random'. Your code has to look like this:

<doctype>
<html>
  <head>
    // head stuff - title, meta tags, style tags
  </head>
  <body>
    // all the content
  </body>
</html>

You can't have anything between the closing head tag and the opening body tag. And you can't have more than one opening html tag or closing html tag. All these are errors, and cause browsers to do strange things, as you are seeing.

Sign In

Some weird layout problem with firefox 3.0.5

Recommended Posts

Xyphon

Link to comment

Share on other sites

haku

Link to comment

Share on other sites

Xyphon

Link to comment

Share on other sites

haku

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information