Answered Need help with white bar between header and page

[radiance32]

Hi all,

I'm building a simple, static html website,
my in-development site is currently available here:

HP Palmtop Tube - News & Video Announcements

www.palmtoptube.com

If you look at the top image containing the site title "HP Palmtop Tube",
and the rest of the page, there is a horizontal white space/bar about 10 pixels high between the top image and the rest of the site.

I've tried everything and can't figure out how to get rid of this white bar and have the bottom dark-green of the top image "connect" properly to the dark-green parts of the rest of the page...

Could someone who knows what to do about this reply with a solution ?
The site is completely static html, so you can just right click and inspect the HTML code when you've loaded the site from the URL i've given above...

Thanks for your time! it's much appreciated,
Terrence

 

[Krygore]

Would you mind sharing the HTML and CSS code for that portion of the site so that we may try to resolve the issue within the code? It looks like it could be part of a border, a margin/padding, or even a line break in the HTML code.

 

[radiance32]

Would you mind sharing the HTML and CSS code for that portion of the site so that we may try to resolve the issue within the code? It looks like it could be part of a border, a margin/padding, or even a line break in the HTML code.

Hi, there is no css file, just the load the index.html file from the link I posted in my first post above, that's it.,
Or, just click on the link above, load the page and right click "view page source"...

look in the html for images/palmtube.jpg, it's the main title image of the page (eg the large image on top with "HP Palmtop Tube" on it)
below that is all the code for the darkgreen areas for the page title and navigation, and the problem is the white line between the title image and the dark green page title/navigation area.

Terrence

 

[Johna]

Add margin-bottom: -4px; to the style="" of the image.

Btw the space is 4px, not 10px.

 

[radiance32]

Add margin-bottom: -4px; to the style="" of the image.

Btw the space is 4px, not 10px.

Hi,

THanks for taking the time to look at it and replying 🙂
I do think the width of the white line depends on the screen resolution and browser you're using,
as most of the site is dynamically scaled (eg I use percentages instead of pixels for widths of tables, cells, images etc...)

I will try your fix this afternoon and see if it works, thanks for your help 🙂

Terrence

 

[radiance32]

Hi,

Although I had to use -5 instead of -4 (I still had a 1 pixel line when using -4), the problem is solved 🙂
Can't wait to fix all my other issues and push my updated, fixed site online in a few days 🙂

Cheers,
Radiance

 

[Johna]

Yeah I noticed depending on the screen site the gap is 4-5px, so then doing -5px is better, it'll display well everywhere.

 

[radiance32]

Yeah I noticed depending on the screen site the gap is 4-5px, so then doing -5px is better, it'll display well everywhere.

yup, i've done some more testing and it works %100

Many thanks, much appreciated! 🙂
Terrence