Friday, February 1, 2013

Internet explorer and column count css property

this week we faced the non support of column-count property problem by the microsoft ie,
finally we ve found a an efficient solution based on a jquery plugin "columnizer plugin "


this is a typical css code for columnized div


.my-column
{
-moz-column-count:3; /* Firefox */
-webkit-column-count:3; /* Safari and Chrome */
 column-count:3;
}
as we said this style is not interpreted by ie  
then


1- we can download the plugin  columnizer

2- we import the appropiriate js file
<script src="????/js/jquery.columnizer.js" type="text/javascript"></script>

3- Now we add a short code to let only Internet explorer invoke the plugin

<script>
$(function(){
if($.browser.msie){
$('.my-column').columnize({
columns:3
});
}
});
</script>
(JQuery is needed in all cases)

That's all thanks to Adam Wulf  the author of the plugin

No comments:

Post a Comment