Center ul in Div Tag

To center the ul and also have the li elements centered in it as well, and make the width of the ul change dynamically, use display: inline-block; and wrap it in a centered div.

<style type="text/css">

.wrapper {

text-align: center;

}

.wrapper ul {

display: inline-block;

margin: 0;

padding: 0;

/* For IE, the outcast */

zoom:1;

*display: inline;

}

.wrapper li {

float: left;

padding: 2px 5px;

border: 1px solid black;

}

</style>

<div class="wrapper">

<ul>

<li>Three</li>

<li>Blind</li>

<li>Mice</li>

</ul>

</div>

Reference URL : http://stackoverflow.com/questions/1708054/center-ul-li-into-div