column try

by Nabaraj Saha

HTML

<script src="http://welcome.totheinter.net/autocolumn/autocolumn.js"></script>
<div class="winWidth"></div>
<ul class="list_unstyled">
                                                                <li><a href="#" class="common-users-link">One Voice</a></li>
                                                                <li>
                                                                    <a href="#"  class="common-users-link">Secutiry</a>
                                                                    <ul class="innerList">
                                                                        <li><a href="#">Travel</a></li>
                                                                        <li><a href="#">IT</a></li>
                                                                        <li><a href="#">Security</a></li>
                                                                    </ul>
                                                                </li>
                                                                <li>
                                                                    <a href="#"  class="common-users-link">Safety, Environment &amp; Real Estate</a>
                                                                </li>
                                                                <li>
                                                                    <a href="#"  class="common-users-link">Speaker's Corner</a>
                                                                </li>
                                                                <li><a href="#" class="common-users-link">OPEN Magazine</a></li>
                                                                <li><a href="#" class="common-users-link">Our Principles of Responsibility</a></li>
                                                                <li><a href="#" class="common-users-link">Brand Book</a></li>
                                             ...

CSS

.list_unstyled > .column > li > a{
    font-weight:bold;
    color:#333;
    text-decoration:none;
}

JavaScript

$('.list_unstyled').columnize({ 
                columns: 4,
             	buildOnce:false
            });
$(window).resize(function(e){
    $(".winWidth").text($(window).width());
    if($(window).width()>500){
    	$('.column').each(function(){		

			$(this).unwrap();

		});

// re-initialize jQuery columnizer with 2 column

		$('.list_unstyled').columnize({ columns: 2 });
    }
})