使用CSS

Question

我正在寻找特定结构上的第一个子行新行，一个具有已定义宽度的容器，子节点可以具有不同文本内容长度的动态宽度。所以每行可以得到1到X个元素。

Childs可以是float / inline-block / flexbox ......无论如何。 在我的情况下，我尝试使用flexbox，但我找不到解决方案，这是我想要的一个例子，但没有类.new-line ：

＆＃13;

＆＃13;

.whatiwant {
  width: 180px;
  border: 4px solid;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.whatiwant span:before {
  content: "- ";
}
.whatiwant span.new-line:before {
  content: "";
}

＆＃13;

<div class="whatiwant">
  <span class="new-line">hello 1</span>
  <span>hello 2</span>
  <span>hello 3</span>
  <span class="new-line">hello 4</span>
  <span>hello 5</span>
  <span>hello 6</span>
</div>

＆＃13;

＆＃13;

＆＃13; 我更喜欢Css解决方案，但如果非常简单，Js就可以了。