横並びにした時に、改行せずにスクロールさせる方法

よく忘れるのでメモ。

<div>
  <ul>
    <li>リスト1</li>
    <li>リスト2</li>
    <li>リスト3</li>
  </ul>
</div>

div {
  width: 100px; /* 任意の数字 */
  overflow-x: scroll;
}
ul {
  white-space:nowrap;
}
li {
  display: inline-block;
  white-space:normal; /* なくても大丈夫nowrapでも */
}