Column CSS for Internet Explorer

June 3, 2013

So a while back I had to display a CMS field into a 3 column field.

Now there are a good amount of ways to go about this, but as a purist I’ll try to keep it simple. Lets talk about using Column CSS for all browsers, including Internet Explorer.

CSS3 has a great rule for column css which is pretty simple. Here is the CSS code I used.

        -moz-column-count: 2;
	-webkit-column-count: 2;
	column-count:  2;
	-moz-column-gap: 50px;
	-webkit-column-gap: 50px;
	column-gap: 50px;

Now those styles work great, but what I REALLY want to touch on is the loading of a columnizer.js file that allows you to make column css for IE8. Here is my code for that.

<!--[if lt IE 9]>
<script src="<?php echo get_stylesheet_directory_uri(); ?>/js/jquery.columnizer.js" type="text/javascript"></script>
<![endif]-->

This is the basic way to make very pure column info for dynamic input variables.

Author

Stay in Touch!

Stay in Touch!
Solutions Architecture

browse through our blog articles

Blog Archive