Removing white space above and below banner

HTML & CSS
1

Logged in members of my forum will see a banner at the top of the page that says: “Help Access World Forums by becoming a Supporting Member. Click Here for paid membership options.” Above and below that banner is too much white space.

To see this, please login with my test details here:

User: SPH
Pw: testing

Any idea how I can reduce the white space above and below that announcement banner?

Thanks,

Jon

2

The extra space below the menu bar seems to be caused by a <br /> break tag on line 250 of the HTML.

The surrounding code looks like this:


<!-- / nav buttons bar -->


<!-- get rid of blank line -->


[color=red]<br />[/color]












<!-- NAVBAR POPUP MENUS -->

	
	<!-- community link menu -->

Of course, that may not be the space that you are talking about. So, another possibility might be the height of the <table> in which the ads are placed. It has a height of 120px and the ads seem to be around 90px high, so it is effectively giving you a 15px space above and below the ads.

Hope this helps you find the culprit.

3

I am not referring to the space below the menu bar. You have to log in to see what I mean as the banner stated in my first post is only shown to logged in members.

4

More break <br /> tags as spacers, Jon Lawrance.

5

As Ron said you have break tags everywhere causing gaps. Break tags should not be used for making space so remove them and use margins or padding where appropriate.

You can see the difference if for testing only you add:


.page br {
    display: none;
}

Of course you can’t leave that rule in place as it will mean that you can’t use breaks at all in that section.