Wordpress Themes - WP Forum at BFA

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)
-   Post-Kicker, -Byline & -Footer (http://forum.bytesforall.com/forumdisplay.php?f=17)
-   -   Site shows up differently in IE 7.0 & Firefox (http://forum.bytesforall.com/showthread.php?t=13244)

night888 Mar 10, 2011 03:32 PM

Site shows up differently in IE 7.0 & Firefox
 
Hello,

Wordpress newbie here...I'm curious as to why there seems to be display issues between firefox and ie 7.0 for my website running the latest version of Atahualpa:

http://www.edmonton-insurance-quotes...-car-insurance

Firefox works excellent, but in Ie there are two issues:
1) The two buttons are not on the same row as they should be;
2) There is a white space about 4 pixels high running through the header image.

Also, is there any difference in support for diamond vs gold members? Just wondering...

Thanks in advance!

lmilesw Mar 10, 2011 03:40 PM

In Atahuala 3.6.4 IE7 Emulation is off by default but can be turned on in ATO>Style & configure Layout.

The two button aren't aligned side be side in Firefox for me. Do you have the left one set to float left?

night888 Mar 10, 2011 04:15 PM

oops float fixed it...thank you very much!

Thank you for the prompt reply...could you tell me if I make a donation to you specifically do I get gold status?


Edit:
Hmmm now the buttons are not lined up correctly (they are in firefox but not in IE). Also I turned out IE7 compatibility but the whitespace is still there...I suck at this :P

lmilesw Mar 10, 2011 06:25 PM

You will get Gold status either way you donate.

With regards to your images I would like to see the code you have in that post for those images. You could use a table with two cells which should make things line up properly. Sometimes the floats and such don't play nice with different browsers.

night888 Mar 10, 2011 09:57 PM

donated earlier today!

here's the code (I've simplified things to try to make it easier):


<div id="brandingArea">
<a href="http://www.edmonton-insurance-quotes.ca/a-quote"><img title="Save hundreds on car insurance with the Discount Checklist" alt="Save all you can on car insurance with our Discount Checklist" src="/img/autoProductButton.gif" style="float: left; padding-top:0px;padding-bottom:0px;padding-left:0px;padding-right:0px;"></a>
<div id="getRateQuoteAuto"></div>
</div>


and the corresponding css:


#brandingArea {
float: left;
margin: 0 0 10px;
padding-top: 0px;
padding-bottom: 0px;
padding-left: 0px;
padding-right: 0px;
width: 559px;
}

#getRateQuoteAuto {
background: url("/img/autoProductButton.gif") no-repeat top right scroll transparent;
display: block;
float: left;
height: 130px;
margin-top: 0px;
margin-bottom: 0px;
padding-top: 0px;
padding-bottom: 0px;
padding-left: 5px;
padding-right: 5px;
position: relative;
width: 250px;
}




I just don't understand why it shows up in Firefox as even but not in IE...I have a feeling it may have to do with Display: Block but when I change it to inline the background just disappears altogether... :confused:

night888 Mar 10, 2011 10:23 PM

update: I can get the two images to line up by changing the following in the css:

#brandingArea {
float: left;
margin: 0 0 5px;
padding-top: 15px;
padding-bottom: 0px;
padding-left: 3px;
padding-right: 0px;
width: 555px;
height: 130px;
}




However, I don't understand why this works...aren't both the image on the left and the background image to the left both inside the same container, so shouldn't changing the padding of the parent class affect both images equally?

lmilesw Mar 10, 2011 10:25 PM

I looks like you have an empty paragraph after the second image. In the HTML editor take out any empty lines just before the first line of text.

You also have the divs set up in a way that is not clear to me but I think the quick fix is the empty paragraph.

night888 Mar 11, 2011 12:36 AM

THANK YOU for solving the issue! :)

I can't believe it was all because of an empty paragraph...lol...

Looks like it's an issue with Wordpress's html editor; it automatically put in a paragraph even though there was no <br> or <p>...weird!!

lmilesw Mar 11, 2011 07:17 AM

In the visual editor hitting enter puts in a paragraph break. In the HTML editor hitting enter puts in a line break. WordPress doesn't show those tags in the HTML editor. There are ways to show those tags but I find them distracting and find that just being aware of how the editor works is enough.


All times are GMT -6. The time now is 04:18 PM.

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