Member Avatar for crunkie

Hi all,

The Situation:
I'm creating a basic template in HTML with CSS that I often use when creating websites.
The Problem:
I am centering my content and cannot get rid of the white border at the top of the page (am testing in Firefox and Chrome).
This is a silly question I'm sure, but the solutions I've looked for on Google didn't work for me.

Here's my CSS:

body
{
	background-color:		#FFF;
	font-family:			"Helvetica";
	font-size:				12px;
	color:				#000;
}

#wrapper
{
	width:					1000px;
	margin:					0px auto;
	background:				#999;
}

And here's the HTML:

<body>
<div id="wrapper">
Template test
</div>
</body>

I would have thought that the "margin: 0px" would have sorted it. I also tried "padding: 0px" but no luck either.

I'm sure it's something really simple, but I just can't find the solution and it's really bugging me!

Thanks in advance guys :)

Crunkie

  • 1 Contributor
  • 1 Reply
  • 112 Views
  • 6 Hours Discussion Span
  • Latest Post Latest Post by crunkie
Member Avatar for crunkie

I've just realised what I've done - I put margin: 0px in the wrapper when it should also be in body to apply it to the whole document.

Knew it was a silly mistake! Sorry about this, but I shall leave the post open in case anyone has an off day like me today.

Be a part of the DaniWeb community

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