Firefox not displaying website correctly
I am trying to get my website to display correctly. When the page loads, my 2 column portfolio loads correctly for an instant, then reverts to single column. Safari, Chrome, Microsoft Edge and Internet Explorer all display the page correctly. I have played with the CSS, going so far as making the min-width for each column as small as I could, but to no avail. Anyone have any ideas, or is this just chalked up to, "another reason to switch to Chrome?" and posting a notice on my website?
الحل المُختار
There's something odd about one of the scripts in your page. My Windows has a default "Text Size" of 125%, which means that all browsers have an effective zoom level of 125%. This is common for users of Windows 7, 8, 8.1, and 10, so probably most of your site visitors who use Windows.
At that default level, a script flips both Firefox and Chrome to a single column either immediately after rendering the portfolio slide-in effect or when I scroll the page. The <li> elements get assigned an inline style with "position: absolute; left: 0px; top: 0px;" (top varies from tile to tile).
In Chrome, the display stabilizes and stays in two columns when I reduce the zoom to 80% (96ppi) and reload the page. However, reducing zoom and reloading does not stabilize the layout in Firefox.
The issue might be that you have an older version of this library:
Isotope PACKAGED v2.0.0
The current release appears to be 3.0.4. I think that's worth a try before trying to debug the code yourself.
Read this answer in context 👍 2All Replies (1)
الحل المُختار
There's something odd about one of the scripts in your page. My Windows has a default "Text Size" of 125%, which means that all browsers have an effective zoom level of 125%. This is common for users of Windows 7, 8, 8.1, and 10, so probably most of your site visitors who use Windows.
At that default level, a script flips both Firefox and Chrome to a single column either immediately after rendering the portfolio slide-in effect or when I scroll the page. The <li> elements get assigned an inline style with "position: absolute; left: 0px; top: 0px;" (top varies from tile to tile).
In Chrome, the display stabilizes and stays in two columns when I reduce the zoom to 80% (96ppi) and reload the page. However, reducing zoom and reloading does not stabilize the layout in Firefox.
The issue might be that you have an older version of this library:
Isotope PACKAGED v2.0.0
The current release appears to be 3.0.4. I think that's worth a try before trying to debug the code yourself.
Modified by jscher2000 - Support Volunteer