Thank you! Your feedback has been delivered
Thank you! Your feedback has been sent

Isotope renders different on mobile+ safari 5

This is our page: http://www.bestsellingimage.com/

We like how it looks in modern desktop browsers Chrome, Safari 7, FF But on mobile devices and tablets, and also in Safari 5 it renders the wrong number of columns and looks not so good.

Please help.

Thanks!

User Gravatar

niceshirt

Posted Dec 15 2013 5:30 UTC

$50


  • Assigned To NBoychev
  • Solved
  • isotope
  • 666 Views

1 Replies


Hello niceshirt,

Can you please remove/comment isotope methods overwrites in masonry-portfolio-2.js.

Also it's not a good idea to use floating numbers for margins this can be issue in webkit and IE browsers. You should use integers for margins, then you will need to recalculate all other sizes. Example:

margins: 2px

w1 = 162px

w2 = (162 + 2)*2 = 328px

Then you should set the smallest width as column width + margin*2 in isotope settings:

$('#container').isotope({
    masonry: {
        columnWidth: 166
    }
});

Regards,

Nikola Boychev

User Gravatar

NBoychev

Posted Dec 15 2013 7:14 UTC

Solution

This didn't solve your task? Get your own custom solution.

Add a reply

By posting a reply on CodersClan you agree to our Terms & Conditions