css - ネストされたリストの境界線スタイル

Question

私のHTMLドキュメントには、次のスタイルのネストされたリストがあります。

li {
    list-style-type:none;
    border:1px solid;
    margin:3px;
}

li li {
    list-style:none;

}


<ul>
  <li>something
    <ul>
      <li>hello</li>
      <li>there</li>
    </ul>
  </li>
</ul>

私の現在のCSSルールの境界線は次のようになります。

私はそれらをこのように見せたいが、<span>タグを挿入しない：

何か案は？

Answer 1

多分そのようなもの：

li {
    clear: both;
    width: 200px;
    list-style-type:none;
    border:1px solid;
    margin:3px;
}
li ul{
    float: left;
}


<ul>
  <li>something
    <ul>
      <li>hello</li>
      <li>there</li>
    </ul>
  </li>
  <li>something
    <ul>
      <li>hello</li>
      <li>there</li>
    </ul>
  </li>
</ul>

結果：