Forum Replies Created
now I change the .container .nine.units to 688px and temporarily solved the problem. But that sounds stupid to me as I want to maintain it at 690 to make the website look good. My analysis is that because 690 is not divided by 4, Chrome kindly round off each product width differently so that the sum is still maintained at 4, but that creates problem to styling like background-size: cover.
Anyway, I deliberately kept another link unresolved so you can investigate and compare: http://ecommerce.rollangle.com/zealous/shop/
I inspected using Chrome’s inspect element and found something strange. The li.product and li.product.first have different width. one is 175 and one is 174. I suspect that this may be the cause of the problem. However, I found no way to resolve it. And this problem do not exist in Firefox or IE. Please help…
The problem is now resolved after searching thru the forum. However, there is yet another problem. I added background to the all product page with cover size property. It is perfect on IE and firefox, but not on Chrome. What is the possible issue? The width of the background fits perfectly to the container. it is weird that the positions of background on two products appear differently…in Firefox they are aligned.