CSS overflow-x: visible; and overflow-y: hidden; causing scrollbar issue

Suppose you have some style and the markup: ul { white-space: nowrap; overflow-x: visible; overflow-y: hidden; /* added width so it would work in the snippet */ width: 100px; } li { display: inline-block; } <div> <ul> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> <li>6</li> <li>7</li> <li>8</li> <li>9</li> <li>1</li> <li>2</li> <li>3</li> <li>4</li> <li>5</li> <li>6</li> <li>7</li> <li>8<

[tttttahiti]

ブラウザの仕様的に overflow-x と overflow-y のどっちかを visible, どっちかを auto にしようとすると visible に指定した側も auto になっちゃう