当溢出隐藏时，列表元素中div之上的额外间隙

Question

我在list元素中有一个div。出于某种原因，当div上隐藏溢出时，div与列表样式项目符号不在同一行。有什么想法吗？

HTML：

<ul><li><div>Here is some long text</div></li></ul>

CSS：

ul {width:150px;}
li {list-style-type:square}
div {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

小提琴：https://jsfiddle.net/scottchantry/supcsayt/

Answer 1

div是一个块元素，它占用一个新行。将display:inline添加到您的div应该可以解决问题。 https://jsfiddle.net/supcsayt/2/

div {
  display: inline;
}