链接不会保留在列表项中

Question

我有这个列表，没有使用<ul>：

<li>some text before <a href="url1">item 1</a> some text after</li>
<li>some text before <a href="url2">item 2</a> some text after</li>
<li>some text before <a href="url3">item 3</a> some text after</li>
<li>some text before <a href="url4">item 4</a> some text after</li>
<li>some text before <a href="url5">item 5</a> some text after</li>

使用这个CSS，我尝试保持链接到位，但onClick它不断向下移动。

#myDiv li a { 
    text-decoration: none;  
    color: #0080BC; 
    outline: none; 
    cursor: pointer; 
    margin: 0; 
    padding: 0; 
    display: inline-block;
}

任何人都可以帮助我以正确的方式完成这项工作吗？ 我必须清楚CSS但我似乎无法完成它。

Answer 1

我有这个列表，没有使用 <ul>

一组没有<ul>的列表项在HTML中无效。由于你有一个带有#myDiv的CSS，你可以用<ul id="#myDiv">这样的方式将整个内容包含在内，因为CSS很好：

<ul id="#myDiv">
    <li>some text before <a href="url1">item 1</a> some text after</li>
    <li>some text before <a href="url2">item 2</a> some text after</li>
    <li>some text before <a href="url3">item 3</a> some text after</li>
    <li>some text before <a href="url4">item 4</a> some text after</li>
    <li>some text before <a href="url5">item 5</a> some text after</li>
</ul>

小提琴：http://jsfiddle.net/nwpem/

列表项很好。但是如果你觉得列表项是内联的，那么你需要添加这个CSS：

#myDiv li {display: inline-block;}