CODEWITHSUNDEEP
htmlcss
Renzo Gaspary
Renzo Gaspary

Reputation: 300

How to truly make a navigation bar 100% width

I'm working on my personal website and when I originally designed it (http://flic.kr/p/83TsXa) it had two horizontal bars that where supposed to extend 100% of the total width of the website, but when I wrote the code I could not get the page to display properly (please see what I mean - www.gaspyweb.com). What am I doing wrong here? What can I do to get the Navigation and the footer bar to display like in the design that I made?

Upvotes: 1

Views: 1853

Answers (1)

Ben Hoffman
Ben Hoffman

Reputation: 8259

The <body> tag of your page has an 8px margin. Once you remove that margin your header and footer bars should extend to 100% of the page. Just to keep it simple add code like this:

html, body {margin: 0; padding: 0;}

The easiest way to figure this out is to use a tool like Firebug to check your elements of your page. It will quickly show you where your CSS issue is.

Upvotes: 2

Related Questions