Wordpress Themes - WP Forum at BFA
Click Here To DONATE! Support the theme development, get more attention and additional benefits based on your donation level. Your forum name will be highlighted.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Header configuration & styling »

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


Build custom WP THEMES, without
coding.
Click here for THEMEFRAME

From the author of Atahualpa, the #1 most
downloaded (700,000+) theme @ wordpress.org
  #1  
Old Mar 24, 2011, 07:01 PM
inkdork's Avatar
inkdork
 
41 posts · Sep 2010
Lancaster, CA
[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/.
  #2  
Old Mar 24, 2011, 07:12 PM
juggledad's Avatar
juggledad
 
22,269 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
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
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #3  
Old Mar 24, 2011, 08:01 PM
inkdork's Avatar
inkdork
 
41 posts · Sep 2010
Lancaster, CA
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.
  #4  
Old Mar 24, 2011, 09:20 PM
inkdork's Avatar
inkdork
 
41 posts · Sep 2010
Lancaster, CA
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.

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
How to make logo area on beside or overlay header image? phuongnv Header configuration & styling 16 Mar 17, 2011 06:09 PM
[SOLVED] Can't get rid of text in logo image area in header area unadoyle Header configuration & styling 2 Sep 2, 2010 04:43 AM
header image as background image for logo area soni Atahualpa 3 Wordpress theme 8 Apr 2, 2010 03:05 AM
How to Switch the Logo Area and Header Image tim5046 Header configuration & styling 1 Jun 2, 2009 12:43 PM
Putting a image background in the header's logo area kirinafa Header configuration & styling 2 Feb 18, 2009 04:08 PM


All times are GMT -6. The time now is 05:11 AM.


Powered by vBulletin® Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.