I am designing a web site using CSS. It looks fine in IE, but terrible in Navigator.

You can take a look at the home page at www.pursuinglife.com. Is it feasible to use this design and still have the page readable in IE and Navigator?

Here is the CSS code I am using:

/* My .com style sheet */
body { font-family: Verdana, Tahoma, Helvetica;
font-size: 11pt;
margin: 0mm;
padding: 0mm;
text-align: center;
}
#maincontent { width: 770px;
margin: 0 auto;
text-align: center;
padding: 5px;
border: 1px solid #98AAB1;
}
#left a:link, #center a:link, #right a:link {
color: #2B5999;
text-decoration: none;
}
#left a:visited, #center a:visited, #right a:visited {
color: #FFA900;
}
#left a:hover, #center a:hover, #right a:hover {
color: #2B5999;
text-decoration: underline;
}
#left a:active, #center a:active, #right a:active {
color: #2B5999;
}
#logo {
background: url(logo2.jpg);
border-top: 1px solid #000000;
border-right: 1px solid #000000;
border-bottom: 1px solid #000000;
border-left: 1px solid #000000;
width: 760px;
height: 119px;
margin-bottom: 0px;
}

<!-- The navbar begins here -->

#navMenu
{
float: clear;
width: 100%;
border: 1px solid #999;
background-color: #aaa;
margin: 5px 0px;
width:758px !important;
/* Fix broken box model for IE5/Win, IE6/Win ignores the following rules */
width /**/:760px;
}

#navMenu a, #navMenu a:visited
{
float: left;
background: #f3f3f3 url('images/navMenu_button.png') 0px 0px;
border-left: 1px solid #ffffff;
border-top: 1px solid #ffffff;
border-right: 1px solid #dddddd;
border-bottom: 1px solid #dddddd;
font:10px verdana;
text-align: center;
color: #000;
text-decoration: none;
height: 15px;
width: 150px;
}

#navMenu a.margin, #navMenu a.margin:visited
{
width: 150px;
}
#navMenu a:hover
{
background: #f3f3f3 url('images/navMenu_button.png') 0px 15px;
}
#navMenu a.margin
{
margin-right: 2px;
}

#navMenu ul, #navMenu li
{
margin: 0px;
padding: 0px;
list-style-type: none;
}
#navMenu li { display: inline; }

<!-- The navbar ends here -->

#left { float: left;
background-color: FFFFFF;
width: 150px;
padding: 0px;
font-size: 10pt;
text-align: left;
border-top: 1px solid #98AAB1;
border-right: 1px solid #98AAB1;
border-bottom: 1px solid #98AAB1;
border-left: 1px solid #98AAB1;
}
ul#sidebar {
list-style: none;
margin: 0;
padding: 0;
background-color: #D6D6D6;
}
ul#sidebar li a:link, ul#sidebar li a:visited {
text-decoration: none;
display: block;
width: 100%;
padding: 10px 5px;
background-color: #5C6F90;
font-size: 10pt;
font-weight: bold;
color: #fff;
}
ul#sidebar li {
border-top: 1px solid #A5B5C6;
}
ul#sidebar li a:hover {
background-color: #43616B;
color: #eee;
}

#center { float: left;
width: 450px;
text-align: left;
border-top: 1px solid #FFA900;
border-right: 1px solid #FFA900;
border-bottom: 1px solid #FFA900;
border-left: 1px solid #FFA900;
margin-left: 5px;
margin-right: 5px;
padding: 5mm;
}
#right { float: left;
width: 150px;
padding: 10px;
font-size: 10pt;
text-align: left;
border-top: 1px solid #98AAB1;
border-right: 1px solid #98AAB1;
border-bottom: 1px solid #98AAB1;
border-left: 1px solid #98AAB1;
}
#footer {
float: clear;
background: url(images/bk_footer.png) repeat-x;
border: 1px solid #000000;
width: 760px;
height: 35px;
text-align: center;
margin-top: 5px;
padding: 10px;
font-family: Verdana, Tahoma, Arial;
font-size: 10px;
color: #FFFFFF;
}
#footer a, a:active, a:visited {
color: #FFFFFF;
text-decoration: none;
}
#footer a:hover {
color: #FFFFFF;
text-decoration: underline;
}

p { color: #000000;
font-size: 11pt;
}
h1 { color: #000000;
text-align: center;
font-size: 15pt;
}

Thank you so much for your help with this issue!

Lavern