Issue with IE8

Hello,

Masonry has some issues with IE8 due to the way it calculates outerwidth, the solution is two fold… make the following change to index.php

<!--[if IE 8]><div id="boxes" class="js-masonry" data-masonry-options='{ "gutter":40, "columnWidth": <?php echo $bavotasan_theme_options['column_width']-20; ?>, "itemSelector": ".masonry" }'><![endif]-->
<!--[if gt IE 8]><!--><div id="boxes" class="js-masonry" data-masonry-options='{ "columnWidth": <?php echo $bavotasan_theme_options['column_width']; ?>, "itemSelector": ".masonry" }'><!--<![endif]-->

to define gutter as part of the json

and add in some sizing to style.css, I used the following:

.lt-ie9 article.masonry { max-width: 290px !important; }
.lt-ie9 article.masonry:first-child { max-width: 630px !important; }

The key is to ensure that IE8’s sizing is appropriate. You may have to fiddle with the gutter and sizes til things look right on IE8… Unless someone has a more elegant solution?

Best regards,
Edward