How to center an unordered list?

Question

I need to center an unordered list of unknown width, while still keeping the list-items left aligned.

Achieve the same result as this:

HTML<

Answer 1

From your post, I understand that you cannot set the width to your li.

How about this?

ul {
  border:2px solid red;
  display:inline-block;
}

li {
  display:inline;
  padding:0 30%; /* try adjusting the side % to give a feel of center aligned.*/
}

    
Hello
    
Hezkdhkfskdhfkllo
    
Hello

Here's a demo. http://codepen.io/anon/pen/HhBwx