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

Isotope / safari problems


In Safari my isotope driven layout fails in two ways:

1) On window resize, or rotation of an iOS device, isotope doesn\'t readjust the layout of the items on the page and leaves objects at the wrong size and/or incorrectly falling across each other etc

2) In Safari, the widths\' of my isotope items are not reflecting the widths set in my CSS. It\'s a responsive layout and viewed at it\'s max-width, in Chrome, Firefox and IE, the items are set to a width of 25%, resulting in 4 cols of items. In Safari it lays out the items in to two columns

The second item here is much less important than the first!

User Gravatar


Posted Jul 10 2013 11:05 UTC


  • Assigned To amort2000
  • Solved
  • jquery

3 Replies

Sorry, should have added a Url -

Edit: Both answers were accepted.

User Gravatar


Posted Jul 10 2013 11:06 UTC


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

try this for the first issue

$(window).on(\"resize\",function(){ $(\".recent_posts\").isotope(\'reLayout\'); });

for the 2nd, I didn\'t quite understand. can you provide a screenshot?

User Gravatar


Posted Jul 10 2013 13:56 UTC

Hello amort2000,

For the 2nd issue - you have a CSS problem. You are not closing one of the media queries - just add \'}\' at line 345 in style.css, so it should looks like this:

.search .post {
@media only screen and (min-width: 900px) {
.home .post, .category-blog .post, .search .post {
    width: 33.3333333333333%


Nikola Boychev

User Gravatar


Posted Jul 10 2013 14:04 UTC

Add a reply

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