假设您有一些样式和标记:
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</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</li> <li>9</li> </ul> </div>
当您查看此内容时。 <ul>
在底部有一个滚动条,即使我已为溢出x / y指定了可见值和隐藏值。
(在Chrome 11和Opera(?)上观察到
我猜测一定有一些w3c规范或某些东西可以告诉我这种情况的发生,但是对我而言,我无法弄清楚为什么。