Wordpress Themes - WP Forum at BFA - [SOLVED] Weird whitespace between header image and logo area background

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)

- Header configuration & styling (http://forum.bytesforall.com/forumdisplay.php?f=15)

- - [SOLVED] Weird whitespace between header image and logo area background (http://forum.bytesforall.com/showthread.php?t=13477)

[SOLVED] Weird whitespace between header image and logo area background

I have a weird white space showing up between the top of my header images and the bottom of my logo area background (if I set the logo area background to no-repeat, its not currently set that way though). You can see now where there is a repeat of the logo background going on making my graphics appear to not line up. The area in question is about 3 or 4 pixels high.

I have looked and looked and can't find anything in the CSS settings that would affect this. However, it was not an issue until I removed a CSS insert that was somehow causing the search box and RSS icons to not show up. Once I removed that and the box/icons appeared, so did the weird spacing.

I am using version 5.3.5. I can't upgrade to a newer version because since I moved to A Small Orange for hosting, I just get a screen showing my background with no content with any newer ones. I am using the most recent version of WordPress.

Any idea on how to remove this gap so my graphics will go together seamlessly again? The URL is http://prettycanhurt.com/.

it looks like the space you have for the image is bigger than the image, so you are getting a repeat of the image. make the space smaller

I tried that first actually. My background image is 77 pixels high. My CSS specifies it is 77 pixels high. Just in case though, I set it to 70 pixels and get the same result. Still has extra space showing a repeat of the image. Doesn't seem to make a difference.

I solved it. I exported my settings, then restored everything to defaults to get the CSS inserts that were present when I first installed it back again, since it was when I removed the ones pertaining to the search box and RSS icons that the problem started.

I had suspicions the issue was with the search box itself, but wasn't sure. This is the insert that was removed and caused the issue.

Code:

td#header {

padding-bottom: 15px;

}

div.searchbox {

position: absolute;

top: 130px;

right: 25px;

}

div.searchbox input.text {

border: none;

padding: 2px 15px 2px 3px;

background: #fff url('<?php bloginfo('template_directory'); ?>/images/search2.gif') no-repeat right center;

-moz-border-radius: 5px;

-webkit-border-radius: 5px;

border-radius: 5px;

height: 15px;

bolder: solid 1px #e7e7e7;

font-size: 11px;

}

I added it back in, one piece at a time until the gap disappeared and the search box vanished. I saw that the search box was invisible because it was being positioned outside of the element. I tweaked the CSS to reposition the search box on the opposite side and everything is perfect.

Code:

td#header {

padding-bottom: 15px;

}



div.searchbox {

position: absolute;

top: 45px;

left: 25px;

}

Thanks for the help. :)