Floodster
Technical User
- Jan 28, 2005
- 204
HI,
I have built my site & have been testing it in FF & IE. When displayed in IE it puts the navigation bar where I want it but in FF it displays it further to the right.
To get a visual you can look at it :
my CSS code is (I have left some out that aren't relevant to this query);
My code for my template is;
All the site works but it's annoying me why it won't display properly, I've tried messing around with different width's etc but to no avail.
Thanks in advance.
I have built my site & have been testing it in FF & IE. When displayed in IE it puts the navigation bar where I want it but in FF it displays it further to the right.
To get a visual you can look at it :
my CSS code is (I have left some out that aren't relevant to this query);
Code:
body{
font-family:Georgia, "Times New Roman", Times, serif;
margin:0;
}
#main_nifty {
position: relative;
background-color: #A0D6A4;
width: 970px;
height: auto;
margin: 1em 1em 1em 1em;
overflow:auto;
}
#container{
background:#A0D6A4;
float: left;
width: 700px;
margin-top:4em;
margin-bottom:1em;
margin-left:1em;
margin-right:0.5em;
}
#menu{
background:#A0D6A4;
float: left;
height: auto;
width: 220px;
margin-bottom:1em;
}
#bottom{
background:#A0D6A4;
margin: 1em 1em 1em 1em;
color: #A0D6A4;
clear: both;
}
#menu ul{
margin-left: 1em;
margin-top:4em;
list-style: none;
}
#menu li{
font-size:120%;
margin-bottom:1em;
font-family:Georgia, "Times New Roman", Times, serif;
}
#menu img{
float:left;
padding:0;
}
#menu a:link, #menu a:visited{
font-size:115%;
color:#000000;
font-weight:normal;
text-decoration:none;
}
#menu a:hover{
color:#990033;
}
My code for my template is;
Code:
<%@LANGUAGE="VBSCRIPT" CODEPAGE="1252"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">[/URL]
<html xmlns="[URL unfurl="true"]http://www.w3.org/1999/xhtml"[/URL] lang="en" xml:lang="en">
<head>
<script type="text/javascript" src="/includes/nifty.js"></script>
<script type="text/javascript" src="/includes/layout.js"></script>
<!--#include virtual="/includes/includes.asp"-->
<link href="/css/menu.css" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="/css/niftyPrint.css" media="print" />
<!-- TemplateBeginEditable name="doctitle" -->
<title>M&B Golf Society</title>
<!-- TemplateEndEditable -->
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<!-- TemplateBeginEditable name="head" -->
<!-- TemplateEndEditable -->
<%
' *** Logout the current user.
dim logout
logout=request.querystring("logout")
If logout=1 then
Session.Contents.Remove("sess_User_Logname")
End If
%>
</head>
<body>
<!--open main_nifty which wraps around all of the menu & container-->
<div id="main_nifty">
<!--open menu-->
<div id="menu">
<ul>
<li><img src="/images/golf_ball.gif" alt="golf_ball" /><a href="/navigation/home.asp">Home</a></li>
<li><img src="/images/golf_ball.gif" alt="golf_ball" /><a href="/navigation/fixtures.asp">Fixtures</a></li>
<li><img src="/images/golf_ball.gif" alt="golf_ball" /><a href="/navigation/results.asp">Results</a></li>
<li><img src="/images/golf_ball.gif" alt="golf_ball" /><a href="/navigation/winners.asp">Winners</a></li>
<li><img src="/images/golf_ball.gif" alt="golf_ball" /><a href="/navigation/handicaps.asp">Handicaps</a></li>
<li><img src="/images/golf_ball.gif" alt="golf_ball" /><a href="/navigation/members.asp">Membership</a></li>
<li><img src="/images/golf_ball.gif" alt="golf_ball" /><a href="/navigation/contact.asp">Contact
Us</a></li>
</ul>
</div>
<!--close menu-->
<!--open container this is where all of the content goes-->
<div id="container"> <!-- TemplateBeginEditable name="main_layer" --> this is
where you can edit </font><!-- TemplateEndEditable -->
<!--close container-->
</div>
<!--open bottom this is where copyright etc goes-->
<div id="bottom">
<p class="privacy"><a class="secret" href="/navigation/login.asp">Design by
John Flood</a> | <a href="[URL unfurl="true"]http://www.w3.org/">Built[/URL] to W3C Standards</a>
| <a href="/navigation/accessibility.asp">Accessibility</a> | <a href="/navigation/links.asp">Links</a></p>
<a href="[URL unfurl="true"]http://validator.w3.org/check?uri=referer"><img[/URL] class="w3c"
src="[URL unfurl="true"]http://www.w3.org/Icons/valid-xhtml10"[/URL]
alt="Valid XHTML 1.0 Transitional" height="31" width="88" /></a>
<!--close bottom-->
<!--close main_nifty-->
</div>
</div>
</body>
</html>
All the site works but it's annoying me why it won't display properly, I've tried messing around with different width's etc but to no avail.
Thanks in advance.