Odd Space between Divisions in FireFox

[delirium]

Hey, I'm having a problem with this space between my divisions in Firefox.

 

Here is my website: http://www.gotogeeks.ca

Here is my CSS: http://www.gotogeeks.ca/css/style_main.css

 

The Header is spaced about 15 pixels away from my body, but all my divisions use the same coding and none of the others are giving me any trouble.

 

Any ideas?

Edited March 10, 2009 by delirium

[Wickham]

The reason for the space in Firefx is that you have a p tag

 

About

 

right at the top of the #body div which has no top padding or margin and the p tag has a default top margin in Firefox whch forces a space.

 

If you add

p { margin-top: 0; }

to your stylesheet the space will disappear. However, this will affect all p tags elsewhere so it would be preferable to add a padding-top to #body but it is a good idea to make padding the same for all browsers for p tags and some other tags by including

 

p { margin: 3px 0; }

 

which makes top and bottom padding 3px and side padding 0 so that paragraph separation is the same in all browsers.

 

#body{ padding-top: 5px;

background-image: url('../img/hbfbg.png');

margin: auto;

width: 800px;

background-color: #544E4F;

}

 

You have an incorrect

tag here shown as :-

 

 

About

...........

 

You don't need it when the padding-top is added to #body and you should not use

tags to create line space, try to use padding or margins to the following element.

 

Experts prefer to use ... instead of ...

 

.. is deprecated, use text-decoration: underline; in a class instead.

[delirium]

The reason for the space in Firefx is that you have a p tag

 

About

 

right at the top of the #body div which has no top padding or margin and the p tag has a default top margin in Firefox whch forces a space.

 

If you add

p { margin-top: 0; }

to your stylesheet the space will disappear. However, this will affect all p tags elsewhere so it would be preferable to add a padding-top to #body but it is a good idea to make padding the same for all browsers for p tags and some other tags by including

 

p { margin: 3px 0; }

 

which makes top and bottom padding 3px and side padding 0 so that paragraph separation is the same in all browsers.

 

#body{ padding-top: 5px;

background-image: url('../img/hbfbg.png');

margin: auto;

width: 800px;

background-color: #544E4F;

}

 

You have an incorrect

tag here shown as :-

 

 

About

...........

 

You don't need it when the padding-top is added to #body and you should not use

tags to create line space, try to use padding or margins to the following element.

 

Experts prefer to use ... instead of ...

 

.. is deprecated, use text-decoration: underline; in a class instead.

 

I'l admit i have no idea why that works, but it did. Thanks!

 

And thanks for pointing out the incorrect line break, i had a bunch of them in here to try somthing and i must have missed that one when removing them.

Edited March 10, 2009 by delirium