为什么滚动条即使向左突出也没有出现? [英] Why doesn't the scroll bar appear even if it protrudes to the left?

问题描述

我创建了此代码.这会在右侧溢出，从而导致出现滚动条:

I created this code. This overflows to the right, which causes a scrollbar to appear:

.content {
  position: absolute;
  height: 100px;
  width: 100px;
  right: -50px;
  top: 50px;
}

<div class="content">
  CONTENT
</div>

但是，此代码向左扩展，并没有生成滚动条.我从W3C规范中解释说，这将在两个方向上创建滚动条.

However, this code, which extends to the left, did not generate scrollbars. I interpreted from the W3C specification that this would create scrollbars in both directions.

overflow-x属性指定水平方向上的溢出处理(即，从框的左侧和右侧溢出)，overflow-y属性指定垂直方向上的溢出处理(即，从框的顶部和底部溢出).

The overflow-x property specifies the handling of overflow in the horizontal direction (i.e., overflow from the left and right sides of the box), and the overflow-y property specifies the handling of overflow in the vertical direction (i.e., overflow from the top and bottom sides of the box).

^{https://www.w3.org/TR/css-溢出-3/}

.content {
  position: absolute;
  height: 100px;
  width: 100px;
  left: -50px;
  top: 50px;
}

<div class="content">
  CONTENT
</div>

W3C规范是否解释了为什么向左投影时不生成滚动条?

Does the W3C specification explain why scrollbars are not generated when projecting to the left?

推荐答案

这是来自第3.3节.滚动原点，方向和限制

由于Web兼容性的限制(由作者利用遗留的bug来秘密地隐藏视觉阅读器中的内容，而不是搜索引擎和/或语音输出)，UA必须在开始时剪切滚动容器的可滚动溢出区域.框的内联开始侧(从而表现出它们在该侧上没有可滚动的溢出).

Due to Web-compatibility constraints (caused by authors exploiting legacy bugs to surreptitiously hide content from visual readers but not search engines and/or speech output), UAs must clip the scrollable overflow region of scroll containers on the block-start and inline-start sides of the box (thereby behaving as if they had no scrollable overflow on that side).

换句话说，溢出在两侧都发生.但这是已裁剪.

In other words, the overflow notionally happens on both sides. But it is clipped.

这篇关于为什么滚动条即使向左突出也没有出现?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！