div block doesn't move back after jQuery toggleSlide [closed]

Question

Here I made this page with jQuery - http://peterhay.com/Fluxx/people

It works fine in ANY browser or device beside Google Chrome..

first row of pictures work ok but any other row (second or third etc..) doesn't go up after jQuery "detail_block" div is getting "display: none" styling... please check the page with Google Chrome and see for yourself.

CLICK on any picture from the second or third row and click again for the "detail_block" get's "hidden" and the row below will not come up... if you click on any image of the FIRST row everything works correctly..

Can somebody please help me with this I can't understand what is wrong... and it works fine in any other browser...

Thank you

Answer 1

It appears the <br> tag you have inside of <div itemprop="articleBody"> is causing the issue in Chrome. It doesn't play nicely with your floated div's. I would recommend removing the <br> tag and using the clear property to clear the float.

.pages_highlight_box { clear: left; }

Removing the <br> solves the issue in Chrome.