Menu icon Foundation
Same layout behaves differently

Hello,

I am using one of the pre-made html layouts from the foundation website and it appears to be 60 pixel wider on the Chrome. Does anyone have any ideas what may be causing this?

Thanks...

Foundation layout issue.fw

layoutchromefirefox

Hello,

I am using one of the pre-made html layouts from the foundation website and it appears to be 60 pixel wider on the Chrome. Does anyone have any ideas what may be causing this?

Thanks...

Foundation layout issue.fw
Rafi Benkual over 4 years ago

Testing the docs on Firefox 35 and Chrome Version 40.0.2214.91 (64-bit) they look identical. We'll probably need to see the markup to see what's happening.

Sader Neoklis over 4 years ago

I haven´t made any changes on the mark-up. I have used one of the pre-made tamplates on the foundation page (http://foundation.zurb.com/templates.html) and for some reason Google chrome shows the entire page 60px wider. I have checked everything yet could not figure it out. About to go crazy !!! Any other thoughts???

Sader Neoklis over 4 years ago

Hello, I think Chrome just renders percentage based layouts differently but in my case it results is a 60px difference in width. I tried to set the width to 960px max but then internal divs did not scales down on Chrome. I think it is a cross browser compatibility issue.

sankhabanerjee over 4 years ago

Can you provide any link?

Sader Neoklis over 4 years ago

Hi,

I have temporarily uploaded the files here:

http://mirava.com.tr/test/foundation-demo.html

Please check it both on Chrome and FF. There is a 60 px difference between the two.

sankhabanerjee over 4 years ago

Can you please explain it more I found nothing issue in chrome and firefox and please check the site on browser lab, there could be some issue in your browsers.

Sader Neoklis over 4 years ago

Hello,

My browsers display all webpages exactly the same. I have also found another post on webmonkey related to this issue:

http://www.webmonkey.com/2010/12/why-percentage-based-designs-dont-work-in-every-browser/

Chrome displays the webpage 60 pixel wider than the FF. I really don´t know what the issue is and no one seems to know what is the cause. It is really frustrating.

I think because Foundation is percentage based grid system, different browsers interpret the output differently.