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] How do I insert an image above the Header section without a white line in IE


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 Sep 21, 2010, 12:35 AM
rmilam
 
25 posts · Sep 2010
Sierra Foothills of Northern California
In http://www.norcallrs.com/ I inserted an image above the header section by adding code to the header.php. In IE it created an extra white line that separates the image and the bar1/header element. I have played with padding, margins, etc and can not get rid of that white line.

Two questions:
1) Is there a "safer" way to insert an image ABOVE the header section?

2) How do I get rid of the white line in IE? It does not appear in FireFox, Chrome or Safari?

Many thanks!
Robin
  #2  
Old Sep 21, 2010, 05:10 AM
juggledad's Avatar
juggledad
 
22,314 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
First off I strongly urge everyone never to modify the theme code if there is a way to make the change in the theme options. That way you don't have to make the change every time there is an upgrade.

the header is 'defined' at ATO->Style & edit HEADER AREA->Configure Header Area. The list of items LEFT to RIGHT define how the items will appear TOP to BOTTOM in the header

In addition to the variables provided, you can add PHP and HTML in this area (just make sure it is valid GRIN)

In your case, you could use should be able to put the image in the atahualpa/images/header folder and then use %image %logo as the first two variables and by only having the one header image, it will display first, then the logo and you should be all set. You may have to adjust the header image height in the options to make it match
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support

Last edited by lmilesw; Sep 21, 2010 at 09:36 AM.
  #3  
Old Sep 21, 2010, 01:31 PM
rmilam
 
25 posts · Sep 2010
Sierra Foothills of Northern California
We want to have the image above the logo area in addition to the rotating header images. I have now inserted the image in the header configuration line so that it reads:

<img src="/wp-content/uploads/trimmed-border-logod.jpg" alt="Northern California Lawyer Referral Service"/> %logo %pages %image %bar1

In the %logo styling area I specified:
margin: 0 0px 0 0;
padding: 0;

However, in IE I still have the white line below the top image between the border image and the logo element. It does not appear in Firefox...

Any idea how to get rid of the white line??? Would love to dump IE, but that isn't going to happen!

Thanks

Robin
  #4  
Old Sep 21, 2010, 04:42 PM
juggledad's Avatar
juggledad
 
22,314 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
Beleive it or not, this issue is caused by the line
HTML Code:
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
Try this, edit header.php and remove that line (it is line 5) and see how it looks

Also, you should change the name of the image 'mages/header/NC LRS Banner2.jpg' to remove all spaces, use an underscore in place of the space. Having a space in the name of an image can cause issues.
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support

Last edited by juggledad; Sep 22, 2010 at 05:19 AM.
  #5  
Old Sep 21, 2010, 10:35 PM
rmilam
 
25 posts · Sep 2010
Sierra Foothills of Northern California
We want to have the image above the logo area in addition to the rotating header images. I have now inserted the image in the header configuration line so that it reads:

<img src="/wp-content/uploads/trimmed-border-logod.jpg" alt="Northern California Lawyer Referral Service"/> %logo %pages %image %bar1

In the %logo styling area I specified:
margin: 0 0px 0 0;
padding: 0;

However, in IE I still have the white line below the top image between the border image and the logo element. It does not appear in Firefox...

Any idea how to get rid of the white line??? Would love to dump IE, but that isn't going to happen!

Thanks

Robin
  #6  
Old Sep 22, 2010, 05:18 AM
juggledad's Avatar
juggledad
 
22,314 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
Robin,

did you remove the code I suggested? What was the result?
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #7  
Old Sep 22, 2010, 10:57 AM
rmilam
 
25 posts · Sep 2010
Sierra Foothills of Northern California
Yes that worked thanks!!! Now should I expect IE7 issues?

Thanks for the naming tip, I will fix that too!
  #8  
Old Oct 1, 2010, 12:47 AM
rmilam
 
25 posts · Sep 2010
Sierra Foothills of Northern California
Juggledad, I thought we had eliminated the whiteline above the header and below the additional image I inserted. I just went to do a demo of the site and happened to be on an IE7 site. Low and behold the white line shows up in IE7.

Any recommendations??? Thanks!

  #9  
Old Oct 3, 2010, 04:41 PM
rmilam
 
25 posts · Sep 2010
Sierra Foothills of Northern California
We solved the white line by removing the image!!!!

Bookmarks

Tags
seccond header image

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
[SOLVED] Black Line Above/Below Header and White Line Before Body Mande Header configuration & styling 1 Sep 9, 2010 09:54 AM
[SOLVED] white line in my background image bij ons Forum How-To 7 Mar 16, 2010 12:39 PM
[SOLVED] why insert image into image header in place to the blogtitle (like a logo) ? gilles Header configuration & styling 1 Sep 5, 2009 05:14 AM
Insert Google Adsense Section Targetting RibaRiva Forum How-To 0 May 19, 2009 12:13 PM
White image appears over header jhughes817 Header configuration & styling 1 Apr 22, 2009 12:33 AM


All times are GMT -6. The time now is 08:38 AM.


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