Setting overflow-x: hidden adiciona uma barra de rolagem vertical [duplicado]

Esta pergunta já tem uma resposta aqui:

CSS overflow-x: visível; e estouro-y: oculto; causando problema na barra de rolagem respostas

Quando eu especificaroverflow-x: hidden em um elemento que transborda horizontal e verticalmente, o elemento obtém uma barra de rolagem vertical além de ocultar o conteúdo que transborda horizontalmente. Eu tentei adicionaroverflow-y: visible e até apenasoverflow: visible, sem efeito.

Estou entendendo mal o que essas propriedades fazem? Eu pensaria queoverflow-x não deve afetar o estouro vertica

sso aconteceu em todos os navegadores que tente

Aqui está um trecho que demonstra o efeito. Estou a usar<pre> tags porque é uma maneira fácil de criar conteúdo excedente, mas parece acontecer com qualquer tag.

pre {
  height: 40px;
  width: 150px;
  margin-bottom: 50px; /* We need this so they don't overlap. */
}

#x-hidden {
  overflow-x: hidden;
}

#y-visible {
  overflow-x: hidden;
  overflow-y: visible;
}

#visible {
  overflow: visible;
  overflow-x: hidden;
}
<pre>
  Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  Praesent bibendum lorem felis, sit amet sodales nunc gravida eget.
  Integer mollis quis magna quis vulputate.
  Cras aliquet convallis efficitur.
</pre>

<pre id="x-hidden">
  Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  Praesent bibendum lorem felis, sit amet sodales nunc gravida eget.
  Integer mollis quis magna quis vulputate.
  Cras aliquet convallis efficitur.
</pre>

<pre id="y-visible">
  Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  Praesent bibendum lorem felis, sit amet sodales nunc gravida eget.
  Integer mollis quis magna quis vulputate.
  Cras aliquet convallis efficitur.
</pre>

<pre id="visible">
  Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  Praesent bibendum lorem felis, sit amet sodales nunc gravida eget.
  Integer mollis quis magna quis vulputate.
  Cras aliquet convallis efficitur.
</pre>

O W3C spec diz:

Os valores calculados de 'overflow-x' e 'overflow-y' são os mesmos que os valores especificados, exceto que algumas combinações com 'visible' não são possíveis: se um for especificado como 'visible' e o outro for 'scroll 'ou' automático ', então' visível 'é definido como' automático '.

Mas isso não menciona o caso quandooverflow-x ouoverflow-y está configurado parahidden, o que para mim implica que essa combinação deve ser realmente possíve

questionAnswers(10)

yourAnswerToTheQuestion