Align mục bên trái trong danh sách không có thứ tự

Question

Tôi có html và css sau:

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; 
} 

Những kết quả trong danh sách không có thứ tự sau đây:

Làm cách nào để căn chỉnh các mục danh sách ở bên trái trong danh sách không có thứ tự?

Tôi đã thử phao và lợi nhuận trong "ul li #wrapper", nhưng điều đó không giải quyết vấn đề ..

Answer 1

Thêm một padding-left: 0pt vào khối #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

Cố gắng giảm padding-left của nguyên tố UL của bạn. Nếu không được, hãy chơi với padding-left và margin-left của UL và LI.

Answer 3

đánh dấu danh sách không có thứ tự của bạn cần phải được đưa ngoài:

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