Список сместился вправо

Question

Я не могу понять, как получить список ссылок, которые будут полностью центрированы. Кажется, меня сдвинули направо. Извините за очень простой вопрос, я новичок в этом.

http://jsfiddle.net/mzm7szqn/

 ul{ 
      text-align:center; 
      width:450px; 
      margin:0 auto; 
      font-family:arial; 
      list-style-type:none; 
     } 
     li{ 
      font-family:osr; 
      display:inline; 
      padding: 5px; 
     } 

<ul> <li><a href = "#">Web Page</a></li> <li><a href = "#">After Effects</a></li> <li><a href = "#">Premiere</a></li> <li><a href = "#">Ableton Live</a></li> <li><a href = "#">Blender</a></li> <li><a href = "#">Auto CAD</a></li> </ul>

Answer 1

ваш <ul> имеет отступы 20px;, что унаследовали. Попробуйте добавить это

ul{padding: 0 !important;} 

Answer 2

добавить отступы: 0; к стилю ul. так что было бы:

 ul{ 
      text-align:center; 
      width:450px; 
      margin:0 auto; 
      font-family:arial; 
      padding: 0; 
      list-style-type:none; 
     }