PDA

View Full Version : White Blocks Between Divisions



Chet.G
Mar 13th, 2008, 04:09 AM
I am designing a new page for a student organization at my university, but I have ended up with empty white space between some of my divisions. I don't know how to get rid of them. Here is a link to the page and the CSS:

http://www.shsu.edu/~org_ptk/Construction/

http://www.shsu.edu/~org_ptk/Construction/CSS/PTK.css


Any and all advice is greatly appreciated.

ChetG

rangana
Mar 13th, 2008, 04:23 AM
You should either reset the margin or set h1 and p element's margin to 0.
To reset the margin, just add this in your CSS declaration:


*
{
margin:0;
padding:0;
}


..Or if you want only want to get those annoying white gaps, have this in your CSS.


#mainContent h1,#mainContent p
{
margin:0;
}


Feel free to choose. See if it helps ;)

Dan Schulz
Mar 13th, 2008, 09:33 AM
Just so you know, the universal reset (that's the one first example given in rangana's post) can interfere with form controls in some browsers. I can't recall which engine does it (though I'm sure it's Gecko - ie: Firefox, Galeon, Netscape 6+, Flock, and so on), but some browsers will strip the margins/padding from the form controls and then refuse to let you re-apply them afterword when you specifically declare the margin/padding width.

But yeah, the problem is the browser defaults for margins and padding being applied. Removing them will solve the problem PDQ.