...

View Full Version : Gap below Header-- How to get rid of?



Scootertaj
03-08-2005, 03:09 AM
Hey guys I was working on my soccer website and I've been trying to solve a little problem. Their is a about a 15px gap below my header and above my navigation. Anyway to get rid of?


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<link rel="stylesheet" type="text/css" href="navbar.css">
</head>

<body>

<p><img border="0" src="logo.JPG" width="300" height="75"></p>

<div id="navcontainer">
<ul id="navlist">
<li id="active"><a href="index.htm" id="current">Home</a></li>
<li><a href="players.htm">Players</a></li>
<li><a href="tournaments.htm">Tournaments</a></li>
<li><a href="schedule.htm">Schedule</a></li>
</ul>
</div>
<p>&nbsp;</p>
<p>&nbsp;</p>
</body>

</html>


#navcontainer ul
{
padding-left: 250px;
margin-left: 0;
background-color: #036;
color: White;
float: left;
width: 100%;
font-family: arial, helvetica, sans-serif;
}

#navcontainer ul li { display: inline; }

#navcontainer ul li a
{
padding: 0.2em 1em;
align:center
background-color: #036;
color: White;
text-decoration: none;
float: left;
border-right: 1px solid #fff;
}

#navcontainer ul li a:hover
{
background-color: #369;
color: #fff;
}

_Aerospace_Eng_
03-08-2005, 03:19 AM
set the margin of your p element to 0px;

Scootertaj
03-09-2005, 12:19 AM
Ahh thanks Aerospace, I really should have thought of that :p . Updated HTML segment and CSS:


<div id="header"><img border="0" src="logo.JPG" width="300" height="75"></div>



#header
{
margin: 0px;
}

PS: 100th Post, YAY!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum