Problem with page in Firefox
Hi everyone. I have designed this thumbnail page, and it loads fine in Chrome and Safari, but not in Firefox. I have tried many different ways in the CSS but cannot get it to work.
Any ideas?
[problem only in Firefox]
http://pelzek.com/misc/jaja/index.html
Megan posted this at 17:48 — 25th October 2011.
She has: 11,421 posts
Joined: Jun 1999
Okay, the images are set to 25% height of a 100% height containing div. I'm not sure why that works in Chrome. It seems to be ignoring the 100% height on the div and applying the 25% height on the image relative to the browser window.
My guess is that Firefox (and Opera, by the way), doesn't understand what it's supposed to be appllying that height relative to. So it's ignoring it (?). I imagine this effect just wouldn't work if the browser doesn't have a concept of percentage heights.
Is the JavaScript just applying the fade effect? It's not affecting the heights of anything, right? I wonder if there would be a way to get Firefox to calculate the height using JavaScript instead.
I hope that helps a bit!
Megan
Connect with us on Facebook!
DavidIpswich posted this at 19:56 — 25th October 2011.
He has: 117 posts
Joined: Aug 2009
If you set images to 25% height then the browser has to constantly work out the size of the image, and this makes it much slower to load.
If you set the image to a fixed size, then your website loads a lot quicker as it leaves the correct space for it as it forms the page.
Even if the difference in speed cannot be seen by the naked eye, it can still be seen by Google. Page loading speed is now one of the things that Google tests to determine where it places your site in the Google search results.
Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.