Firefox Ignores Rows

[squashedpixel]

We seem to be having an issue using match heights in Firefox ( latest release although it did do the same in previous version ).

Basically we have 5 rows, on each row are 4 divs ( its just a product collection page ). The JS is set so that it should apply different heights to each row, which it is doing perfectly, however in firefox it seems to be ignoring this and setting all the divs at the same height.

Let me know if you need any more specific info

[liabru]

Are you still having this issue? If so could you provide an example jsfiddle? Thanks

[squashedpixel]

Hey

Yea were still having this issue however we think we have worked out what is causing it, we just wont have a perfect solution yet.

The issue is being caused by how firefox handles images within a table cell.

Basically we have a div with display table set on it, and the eqheights plugin adds the heigt to this div.

Inside this is another div set as display table-cell, and vertically aligned, this centers the image no matter what the height.

In firefox an image inside this setup will overflow the box, to fix this you add table-layout: fixed; to the div with display table; This fixes the image overflowing.

So what it appears is happening is that even though the image now scales, the jquery is still reading the height at the full size image height, rather than its scaled height.

e.g if the full size image height is 200px, but on this page it is scaled to 100px, the jquery still reads the height as 200px, causing the height to be large than it actually needs to be.

Let me know if this helps you pin down the issue

Thanks

Ben

On 9 November 2015 at 20:30, Liam [email protected] wrote:

Are you still having this issue? If so could you provide an example jsfiddle? Thanks

— Reply to this email directly or view it on GitHub https://github.com/liabru/jquery-match-height/issues/76#issuecomment-155183576 .

Ben Henry

Front End Developer Squashed Pixel Ltd t : 01535 517 729 [email protected] www.squashedpixel.co.uk

*Connect with us on :Facebook http://www.facebook.com/pages/Bradford/Squashed-Pixel/202190017196 | Twitter http://twitter.com/squashedpixel | LinkedIn http://www.linkedin.com/companies/squashed-pixel?trk=co_search_results&goback=.cps_1260370812220_1 *

Squashed Pixel Limited, The Studio, Bridge House, 13 Devonshire Street, Keighley, BD21 2BH

Registered in England & Wales Company No: 6980425 | VAT No: 978 8323 58. The unauthorised use, disclosure, copying or distribution of this email or any of the information it contains is prohibited and may be unlawful. If you are not the intended recipient please notify the sender immediately.

[image: kbid-signature-support]

[liabru]

How is the image set to scale? If the image is bigger than the container, it will always overflow. When I tried adding any kind of scaling to the image, jQuery always reports the correct height.

Can you provide a jsfiddle?