如何允许自动换行和水平滚动

Question

我试图实现水平滚动，经过大量搜索后我找到了使用

的解决方案

.wrapper{
  overflow: auto;
}
.innerWrapper{
  overflow-x: scroll;
  overflow-y: hidden;
  white-space: nowrap;
}

这给了我添加新的div元素所需的解决方案，这些div元素可以横向调整，但是如果我有一个像#tagsomething这样的巨大单词，我希望这个单词像

一样被打破

.tagLink{
  word-wrap: break-word;
}

这并不起作用，因为我知道我在整个容器上使用nowrap，有没有办法解决这个问题？

查看代码：https://jsfiddle.net/v5s5ema8/2/

Answer 1

您可以简单地在子元素上覆盖它。

.tags {
    white-space: normal;
}

Updated fiddle