Cannot remove whitespace on top of html page

TonyCabone
TonyCabone used Ask the Experts™
on
I need help removing the white space below the navigation menu on this page:

http://sirona.webcity.com.au/~wbw49384/

The website was setup using tables and I just can't seem to get it right.
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Top Expert 2005

Commented:
Looks fine in IE 8, Safari, Chrome, Firefox and Opera. What browser are you using and have you cleared your cache?
I think that it loks fine in IE6 as well, but if you are talking about the 3/4" or so between the navigation menu and your main title, it could be in one of your hidden <div> tags. There are 3 hidden and 1 visible that are considerably taller than the others.

Hidden <div> tag object take up the space even whem hidden.
http://www.devx.com/tips/Tip/13638
<div style="position: absolute; visibility: visible; background-color: rgb(255, 255, 255); width: 478px; height: 22px; font-family: Arial,Helvetica,sans-serif; font-weight: bold; font-style: normal; font-size: 7.4pt; z-index: 101; top: 94px; left: 285px;">

<div style="position: absolute; visibility: hidden; background-color: rgb(189, 200, 214); width: 122px; height: 43px; font-family: Arial,Helvetica,sans-serif; font-weight: bold; font-style: normal; font-size: 7.4pt; z-index: 102; top: 0pt; left: 0pt;">

<div style="position: absolute; visibility: hidden; background-color: rgb(189, 200, 214); width: 107px; height: 64px; font-family: Arial,Helvetica,sans-serif; font-weight: bold; font-style: normal; font-size: 7.4pt; z-index: 102; top: 0pt; left: 0pt;">

<div style="position: absolute; visibility: hidden; background-color: rgb(189, 200, 214); width: 152px; height: 64px; font-family: Arial,Helvetica,sans-serif; font-weight: bold; font-style: normal; font-size: 7.4pt; z-index: 102; top: 0pt; left: 0pt;">

Open in new window

Author

Commented:
Mozilla 3.6.6, yes cache has been cleared.

Yes I am talking about the space between menu & main title.  The code has something to do with the drop down navigation which I think is faulty & needs replacing. Can I change any of the above code to reduce the white space without hindering the navigation?
Become a Microsoft Certified Solutions Expert

This course teaches how to install and configure Windows Server 2012 R2.  It is the first step on your path to becoming a Microsoft Certified Solutions Expert (MCSE).

Commented:
Just give valign="top" to td in which your main content starts

<td colspan="3" valign="top"><br>
Welcome to Willunga Basin Water Company...
and rest of your content.

Hope this works fine for you

- Jayant
Top Expert 2005

Commented:
I don't see the white space. Is this an IE 6 or 7 issue?

willunga.jpg

Author

Commented:
That's weird, I see it on Mozilla 3.6.6 & IE 8. The picture you've uploaded is how it should look.

Commented:
this issue comes only on resolution 1280x1024
and not on resolution 1024x768
that's why i said to make that td valign="top so that it starts from top",  then that blank space wont come.. as now if the screen size increases the content comes in middle of td, and showing blank space.
Top Expert 2005

Commented:
That was 1280 x 800
I agree with jayantc, adding valign="top" seems to close the gap a bit. Though it doesn't look bad in IE6. That is why I was clarifying where the gap you were seeing is located.

<td colspan="3" valign="top"><br>
Welcome to Willunga Basin Water Company...
and rest of your content.

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial