delirium Posted March 10, 2009 Report Share Posted March 10, 2009 (edited) 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 Quote Link to comment Share on other sites More sharing options...
Wickham Posted March 10, 2009 Report Share Posted March 10, 2009 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. Quote Link to comment Share on other sites More sharing options...
delirium Posted March 10, 2009 Author Report Share Posted March 10, 2009 (edited) 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 Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.