Menu
Some time ago I had a JavaScript code, which compensated for the visitor’s browser type ie. Opera, Firefox or IE. I’ve lost that script and can’t seem to author a new one, so here I am.
The following “code” when viewed in IE, is left justified and when viewed in Opera, it is centered, like I intended it to be.
Is there a routine that anyone may know of to correct this problem?
The coded page:
[CODE]<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.0 Transitional//EN”>
<html>
<head>
<style type=”text/css”>
<!–
/* style.css – a simple style sheet */
#container {
width: 766px;
margin: 0 auto;
padding: 0;
}
#header-01 {
width: 730px;
height: 100px;
margin: 0 0 2px 0;
border: 1px solid green;
font-weight: normal;
background-color: #ffd;
padding: 5px;
}
#navigation {
float: left;
width: 150px;
height: 300px;
margin: 2px 2px 2px 0;
border: 1px solid red;
font-weight: normal;
background-color: #fdf;
padding: 5px;
}
#content-01 {
float: left;
width: 422px;
height: 300px;
margin: 2px;
border: 1px solid blue;
font-weight: normal;
background-color: #dff;
padding: 5px;
}
#content-02 {
float: left;
width: 150px;
height: 300px;
margin: 2px 0 2px 2px;
border: 1px solid gold;
font-weight: normal;
background-color: #efe;
padding: 5px;
}
#footer {
clear: both;
width: 730px;
height: 100px;
margin: 0 0 2px 0;
border: 1px solid purple;
font-weight: normal;
background-color: #eef;
padding: 5px;
}
–>
</style>
</head>
<body>
<div id=”container”>
<div id=”header-01″>
<h2>Header</h2>
</div>
<div id=”navigation”>
<ul>
<p>Navigation</p>
</ul>
</div>
<div id=”content-01″>
<p>Content-01</p>
</div>
<div id=”content-02″>
<p>Content-02</p>
</div>
<div id=”footer”>
<p>Footer</p>
</div>
</div> <!– container –>
</body>
</html>
Thanks in advance for your time, knowledge and understanding!
Regards,