Header and Nav Divs Separated

klweb · 10-22-2009, 11:54 PM

Does anyone know why the "header" and "nav" divs are separated on this page? After playing around with it for a while, I coded it the way I had earlier, when there was no gap. Now, somehow, there is. Not sure what I'm missing.

The page: DamonPlatisLaw.com

The css: damonplatislaw.com/style.css

I appreciate your time.

klweb · 10-23-2009, 04:13 AM

Well, it looks like I've solved it. For anyone else who might be running into this little issue, try adding this simple bit of code to your css file:

* { margin: 0}

Worked for me!

darrenfox · 10-23-2009, 01:44 PM

Just keep in mind that will set a margin 0 for everything including your paragraphs unless you specify one per item.

PixelPusher · 10-23-2009, 03:18 PM

Did that fix the problem? The divs don't look separated in FF3 and IE8. FYI, a global reset is a good idea but I dont use the asterisk (*) symbol. I usually add all the most common items I use when building a site. Then if they need to be different than the global just create a style for them. Like so:

Code:

html, body, div, a, span, ul, li, p {
   margin:0;
   padding:0;
}
p.specific {
   margin:10px 0 5px;
   padding:8px;
}

10-22-2009, 11:54 PM	#1
klweb New Member Join Date: Oct 2009 Posts: 2	Header and Nav Divs Separated Does anyone know why the "header" and "nav" divs are separated on this page? After playing around with it for a while, I coded it the way I had earlier, when there was no gap. Now, somehow, there is. Not sure what I'm missing. The page: DamonPlatisLaw.com The css: damonplatislaw.com/style.css I appreciate your time.

10-23-2009, 01:44 PM	#3
darrenfox Bronze Member Join Date: Jul 2008 Location: Illinois Posts: 85	Just keep in mind that will set a margin 0 for everything including your paragraphs unless you specify one per item. __________________ Darren Fox Small Business Web Design

10-23-2009, 03:18 PM	#4
PixelPusher Super Moderator Join Date: Oct 2008 Location: Arizona, USA Posts: 1,053	Did that fix the problem? The divs don't look separated in FF3 and IE8. FYI, a global reset is a good idea but I dont use the asterisk () symbol. I usually add all the most common items I use when building a site. Then if they need to be different than the global just create a style for them. Like so: Code: html, body, div, a, span, ul, li, p { margin:0; padding:0; } p.specific { margin:10px 0 5px; padding:8px; } __________________ John Darling* Graphic / Web Designer SmarterTools Inc. (877) 357-6278 www.smartertools.com

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode

10-23-2009, 04:13 AM	#2
klweb New Member Join Date: Oct 2009 Posts: 2	Well, it looks like I've solved it. For anyone else who might be running into this little issue, try adding this simple bit of code to your css file: * { margin: 0} Worked for me!