I have a header on my website. Whenever i add a tag in side the header an annoying white space forms above it. This happens only in firefox:


#head{ width:100%;


<!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">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link type="text/css" rel="stylesheet" href="styles/general.css" />
<title>PSPF Intranet system</title>

          <div id="head">
             <div id="menubar">

Thanking you in advance

Recommended Answers

All 6 Replies

  • Item1
  • Item2
  • Item3
  • Item3

try styling unordered lists
not sure, but, the default style for lists has a whitespace between li elements

ul {margin:0; padding:0;}
ul li {margin:0; padding:0;}

its not just the list tag, its any tag i add.

Would those tags happen to be in between the <ul> tags? In that case they would still create a whitespace above your header. The suggestions almostbob made should help in removing all the margins for ul and li tags, and they certainly remove the whitespace in Firefox with the code you provided. If you're only interested in removing the top margin, you could also use


If the whitespace keeps returning with different tags just add the line tag{margin-top:0;} or tag{margin:0;} for the specific tag(s) as well.

Hope that helps, good luck.


still... it works fine with IE but not with firefox

solved: I just float some divs... it works great.

Thank you all.

try to add specifically
margin-top: 0px; in the body css

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, learning, and sharing knowledge.