Different width on Chrome and Firefox on same screen
-
When I view a non-home page with a left sidebar on Firefox (version 25.0.1) it looks significantly different to the same page on Chrome (Version 31.0.1650.57 m). The difference seems to be the width of the middle section of the page (‘container’ class with an id of ‘main-wrapper’). Chrome is showing this middle section much narrower than in Firefox. (BTW the header and footer are not affected and fill the width of the screen).
I’m using a screen 1280 x 1024. I’ve worked out that the number of px of the “width” being used by Firefox is 1170 while in Chrome it is using a width of 940. The 130 px difference is significant.
I am using the “blue” theme. I am using a child theme. I have tried removing all of my CSS changes in my child’s style.css file but the problem persisted. I tried using the green.css file but that did not fix the problem. So the cause must be in the original blue.css (it is unchanged from the installation and the version of the Customizr theme is 3.0.13).
Using Firebug on Firefox, I can see the width of 1170 is coming from
line 6847 of the blue.css file. Here’s the blue.css code:.container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container { width: 1170px; }Using Inspect Element on Chrome, I can see that the width of 940 comes from line 393 of blue.css file. Here’s the blue.css code:
.container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container { width: 940px; }I am a relative newcomer to CSS so I can’t work out why one browser is using one section of blue.css and another browser is using a completely different section of the same file. Is this just a difference in the browser’s interpretation of the same CSS information? Is there some way I can fix this?
My web site is under development and closed to the public at the moment. If you need to see it, just let me know so I can open it up for a brief period while you have a look.
Thanks in advance.
The topic ‘Different width on Chrome and Firefox on same screen’ is closed to new replies.
