2
respostas

Banner ultrapassa a tela

O banner do twitter está ultrapassando a tela. E adiciona a barra de rolagem no eixo X. Existe uma maneira de excluir somente aquela parte do banner ? Obrigado pela atenção.

.siga-twitter{
    text-transform: lowercase;
    width: 14em;
    line-height: 1;
    padding: 1em 0;
    box-sizing: border-box;
    text-align: center;
    text-decoration: none;
    background-color: #3C1D3D;
    color: white;
    border: .25em solid black;
    font-size: 0.4em;
    font-family: "Open Sans Condensed", sans-serif;
    position: absolute;
    top: 0;
    right: 0;
    transform-origin: 0 0;
    -webkit-transform: translate(6.5754em, -2.4749em) rotate(45deg);
    -moz-transform: translate(6.5754em, -2.4749em) rotate(45deg);
    -o-transform: translate(6.5754em, -2.4749em) rotate(45deg);
    -ms-transform: translate(6.5754em, -2.4749em) rotate(45deg);
    transform: translate(6.5754em, -2.4749em) rotate(45deg);
}
2 respostas

Oi Thiago, tudo bem?

Você poderia usar o overflow-x: hidden pra esconder esse scroll. O mais indicado seria descobrir de onde tá vindo exatamente essa barra, mas para você não ficar parado no curso iria de overflow mesmo.

Espero ter ajudado,

Abcs!

Também tive a mesma situação e não consegui identificar o problema. Suspeito que seja algo na tag "header", pois usei o overflow-x: hidden no elemento banner e não surtiu efeito, porém, quando usei no "header", resolveu o problema.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software