We help IT Professionals succeed at work.

Check out our new AWS podcast with Certified Expert, Phil Phillips! Listen to "How to Execute a Seamless AWS Migration" on EE or on your favorite podcast platform. Listen Now

x

Weird layout difference on Firefox on Windows

jasimon9
jasimon9 asked
on
Medium Priority
580 Views
Last Modified: 2012-06-22
I have just completed a display ad for one of our customers. The ad is now in "pre-publication." However, there is something I have rarely seen before, although it seems it is getting more common. The problem is that Firefox on Windows is acting weirdly.

We support Internet Explorer, Firefox in Windows, Firefox on the Mac, Chrome and Safari. In this specific instance, the ad is laying out properly in all browsers except Firefox on Windows. I have been starting to notice small irregularities lately on Firefox on Windows, but nothing as drastic as in the current situation.

I am posting two screen shots showing the intended layout and the faulty Firefox on Windows layout.

The section in question is the "bow" image and text. It is absolutely positioned so as to superimpose it over some white space which is part of the image to the right. In addition, I am using the "IEroot" hack to position it properly for IE. The IEroot hack is simply using conditional comments as described at http://www.positioniseverything.net/articles/cc-plus.html. However, this should not have any effect as it is only to assist IE get it right.

In addition, the container div of the positioned div is position:relative in order to get IE to work properly. Again, this should not be affecting Firefox on Windows.

Firefox is 3.6.16 on both Windows and Mac.

Firefox on the Mac is working; why not on Windows?

 Desired layout
 Faulty layout in FF in Win
Comment
Watch Question

Commented:
Unlock this solution with a free trial preview.
(No credit card required)
Get Preview

Author

Commented:
There is often a difference in rendering between Windows and Macs. This is especially noticeable in Firefox, as you would think the rendering should be the same. The difference is often because the identically named fonts are shown differently on the two platforms, resulting in different spacing of elements.

The issue of this ticket seems to be caused by this problem, and the workaround thus takes advantage of it as well, by not depending upon the layout induced by the font size.
Unlock the solution to this question.
Thanks for using Experts Exchange.

Please provide your email to receive a free trial preview!

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.