Question

I’m working on building a website, and everything is pretty much done, but I’m running into issues that, from what I’ve read here, are a result of webkit in firefox and ie.

Here is one of the pages that is having problems:

http://prdesignstudio.com/Seattle.html

When you load it in Chrome or safari it works fine, the images are reflected at the bottom, and there are no images on a lower row. When you open it in Firefox or ie, on the other hand, there are no reflections, and the last image in the set is on a lower row. Another thing that’s odd is that the problem doesn’t occur on every page, and it also doesn’t seem to be based on the number of images in the gallery. (The different pages can be found by clicking on portfolio)

Anyone know how to fix this? Also, if fixing it requires me to remove the webkit portions of the .css, does anyone know of something else I can do to get the reflections? They’re not necessary, but I like them XD

All the page’s code can be found here: http://jsfiddle.net/2DvSP/

Thanks in advance for any help.

Answer 1

As for the images appearing on a lower row and the occurance of this on not all but some pages, you have inline styles set

div calss="container" style="width: 2080px;"

If you increase the width, this problems does not happen in FF4.01 and IE9.