Learning Hub Logo
CSS
  • Introdução ao CSS
  • Sintaxe do CSS
  • Seletores CSS
  • Comentários no CSS
  • Cores no CSS
  • Background no CSS
  • Bordas no CSS
  • Margens no CSS
  • Padding no CSS
  • Height e Width no CSS
  • Texto no CSS
  • Fontes no CSS
  • Ícones no CSS
  • Box Model
  • Display no CSS
  • Position no CSS
  • Z-index no CSS
  • Overflow no CSS
  • Float e Clear no CSS
  • Flexbox
  • Grid
  • Media Queries
  • Opacity e Transparência
  • Sombras no CSS
  • Gradientes no CSS
  • Transições no CSS
  • Animações no CSS
  • Variáveis CSS

Sobre Diego Pinho

Professor especialista em tecnologia com mais de 10 anos de experiência. Autor de livros técnicos e criador de cursos que já impactaram milhares de estudantes.

Visite meu site principal →

Serviços

  • Área do Aluno
  • Solicite um orçamento
  • Trabalhe Conosco

Redes Sociais

  • Youtube
  • TikTok
  • Instagram
  • LinkedIn

Links

  • Site Institucional
  • Nosso Blog
  • Cursos Online
  • Livros Publicados

Professor Diego Pinho

Educação, Tecnologia e IA © 2026

Discord
CSSOverflow no CSS
1 min de leitura

Overflow no CSS

Como controlar o que acontece quando o conteúdo é maior do que o elemento que o contém

Para que serve a propriedade overflow?

Quando o conteúdo de um elemento é maior do que o espaço definido para ele, o CSS precisa saber o que fazer com o excesso. A propriedade overflow controla esse comportamento.

Carregando...

Os valores principais

visible

É o valor padrão. O conteúdo que ultrapassa o limite do elemento continua visível, vazando para fora.

Carregando...

hidden

O conteúdo que ultrapassa o limite é cortado e fica invisível. Sem barra de rolagem.

Carregando...

Muito usado para cortar imagens ou textos que ultrapassam a área de um card, por exemplo.

scroll

Adiciona barras de rolagem ao elemento, independente de o conteúdo precisar ou não delas.

Carregando...

auto

Parecido com scroll, mas as barras de rolagem só aparecem quando o conteúdo realmente precisa delas. É o valor mais recomendado quando você quer rolagem.

Carregando...

Controlando os eixos separadamente

As propriedades overflow-x e overflow-y permitem controlar o comportamento horizontal e vertical de forma independente.

Carregando...

Uso comum: ocultar texto longo

Uma técnica bastante usada é cortar texto longo em uma linha só com reticências, combinando três propriedades:

Carregando...

O resultado: textos longos aparecem como "Título muito longo que não..." em vez de vazar para fora do elemento.

AnteriorZ-index no CSSPróximo Float e Clear no CSS