CSS 列表问题

Question

如何解决我的 css 列表问题，形成在 div 标签内显示的文本。

# ordered lists - the 
list items are marked with numbers or letters

在 div 标签内时这样显示。

# ordered lists - the 
  list items are marked with numbers or letters.

这是 html。

        <div>
            <h2>header</h2>
                <ul>
                    <li>ordered lists - the list items are marked with numbers or letters</li>
                    <li>ordered lists - the list items are marked with numbers or letters</li>
                </ul>
        </div>

CSS。

div {
    margin: 0px 0px 15px 0px;
    padding: 0px 0px 5px 0px;
    background: #fff;
    float: right;
    width: 302px;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border: 3px solid #fff;
}

div h2 {
    text-indent: 10px;
    margin: 0px;
    padding: 5px 0px 5px 0px;
    font-size: 1.4em;
    width: 302px;
    color: #fFF;
    border-bottom: 1px dotted #fff;
}

div ul {
    padding: 0px;
    margin: 0px;
    line-height: 20px;
    width: 308px;
}

div li {
    list-style-position: inside;
    border-bottom: 1px solid #fff;
    padding: 5px 10px;
    margin: 0px;
    width: 282px;
    color: #ffffff;
}

Answer 1

第一个是list-style-position: inside，另一个是list-style-position: outisde和一些padding。