Align lista pozycja w lewo w nieuporządkowanej liście

Question

Mam następujące html i css:

HTML:

<div id="wrapper"> 
    <ul> 
    <li>li1</li> 
    <li>li2</li> 
    </ul> 
</div> 

CSS:

#wrapper 
{ 
} 

#wrapper ul 
{ 
    width:50px; 
    height:100px; 
    border-style:solid; 
    border-width:1px; 
    list-style-type:none; 
} 

#wrapper ul li 
{ 
    border-style:solid; 
    border-width:1px; 
} 

co skutkuje poniższej listy nieuporządkowanej:

Jak wyrównać elementy listy w lewo na liście nieuporządkowanej?

Próbowałem pływaka i margines w "#wrapper ul li", ale to nie rozwiązuje problemu ..

Answer 1

Dodaj padding-left: 0pt do bloku #wrapper ul:

#wrapper ul 
{ 
    width:50px; 
    height:100px; 
    border-style:solid; 
    border-width:1px; 
    list-style-type:none; 
    ' CHECK THE NEXT LINE ' 
    padding-left: 0pt; 
} 

Answer 2

spróbuj zmniejszyć padding-left swojego elementu ul. Jeśli to nie pomoże, graj z padding-left i margin-left of UL i LI.

Answer 3

Twoje nieuporządkowane lista znaczników należy umieścić poza:

#wrapper ul { 
    list-style-type: none; 
    list-style-position: outside; 
}