[SOLVED] How do I insert an image above the Header section without a white line in IE
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 |
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 |
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 |
Beleive it or not, this issue is caused by the line
HTML Code:
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> 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. |
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 |
Robin,
did you remove the code I suggested? What was the result? |
Yes that worked thanks!!! :) Now should I expect IE7 issues?
Thanks for the naming tip, I will fix that too! |
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! :( |
We solved the white line by removing the image!!!!
|
All times are GMT -6. The time now is 08:47 PM. |
Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.