I am trying to position the menu bar at the top of the div, but it appears at the bottom of the div and can hardly be read. I have searched and done all i have found on the net. Pls help with any ideas. Here is the code with.
css file is
@charset "utf-8";
/* CSS Document */
#wrapper {
width:1190px;
height:120px;
margin-left:auto;
margin-right:auto;
}
#topheader {
width:1190px;
height:95px;
background-color:#03F;
}
#nav{
width:1190px;
height:30px;
background-color:#999;
margin:0px;
padding:0px;
}
#nav ul{
margin:0px;
padding:0px;
}
#nav ul li{
display:inline;
float:left;
height:30px;
list-style:none;
margin-left:15px;
}
#nav li a {
text-decoration:none;
color:#fff;
}
#nav li a:hover {
text-decoration:underline;
}
the php header file is
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="styles/header.css" />
</head>
<body>
<div id="topheader">
display image for the site
</div>
<div id="nav">
<ul>
<li><p><a href="home.php" target="field">Home</a></span></p></li>
<li><p><a href="about.php" target="field">About</a></span></p></li>
<li><p><a href="ministries.php" target="field">Ministries</a></span></p></li>
<li><p><a href="prayer.php" target="field">Prayers</a></span></p></li>
<li><p><a href="join.php" target="field">Join / Contact us</a></span></p></li>
</ul>
</div>
</body>
</html>
and the index page is
<?php
/**
Index Page that will display all the pages for fountain with life website
*/
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<div id="head">
<?php include("includes/header.php"); ?>
</div>
<div>
<iframe class="field" width="1190px" height="450px">
</iframe>
</div>
</body>
</html>