Tag HTML <spacer> (Obsoleto) — O Que Usar em Seu Lugar

A tag HTML <spacer> é um elemento obsoleto que nenhum navegador moderno suporta. Não a utilize. Se você precisar adicionar espaço vazio entre elementos em uma página web, recorra ao CSS — as propriedades margin, padding e gap oferecem controle total e confiável em todos os navegadores.

Esta página explica o que era o <spacer>, por que desapareceu e — mais importante — as técnicas modernas de CSS que você deve usar em seu lugar.

Perigo

A tag <spacer> nunca fez parte de nenhum padrão HTML oficial. Ela está sem funcionamento em todos os principais navegadores há mais de duas décadas. Qualquer elemento <spacer> em sua marcação é silenciosamente ignorado. Use CSS margin, padding ou gap em vez disso.

Um breve histórico

Em meados da década de 1990, antes que o CSS estivesse amplamente disponível, os autores web não tinham uma forma padrão de controlar o espaçamento. Um truque comum era inserir uma imagem transparente de 1×1 pixel (o "spacer GIF") e expandi-la com atributos width e height para empurrar o conteúdo.

Para tornar isso menos complicado, a Netscape introduziu o elemento proprietário <spacer> no Netscape Navigator em meados dos anos 1990. Ele permitia adicionar espaço vazio horizontal, vertical ou em bloco sem carregar uma imagem. Contudo:

Era uma extensão exclusiva do Netscape — o Internet Explorer e outros navegadores nunca o implementaram.
Nunca foi adicionado à especificação HTML.
Quando o CSS amadureceu, tornou-se completamente desnecessário.

Como resultado, o <spacer> foi abandonado. Hoje ele está listado entre as tags HTML obsoletas e depreciadas e é ignorado por todos os navegadores.

A sintaxe antiga (não funcional)

Apenas para referência histórica, veja como o <spacer> era escrito. A tag era vazia, portanto não tinha tag de fechamento. Este código não faz nada em nenhum navegador atual — é mostrado apenas para ilustrar a sintaxe legada.

<!-- OBSOLETE — does not work in any modern browser. Do not use. -->
<p>
  Some text
  <spacer type="horizontal" size="100">
  more text after a horizontal gap.
</p>

<spacer type="block" width="100" height="50">

A forma moderna: use CSS

O CSS substitui todos os casos de uso que a tag <spacer> tentava cobrir e funciona em qualquer lugar.

Espaço horizontal e vertical com `margin` / `padding`

Use margin para adicionar espaço fora de um elemento e padding para adicionar espaço dentro dele. O exemplo abaixo adiciona espaço horizontal entre duas palavras e espaço vertical abaixo de um parágrafo:

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      .gap-right {
        /* horizontal space after the word */
        margin-right: 100px;
      }
      .spaced {
        /* vertical space below the paragraph */
        margin-bottom: 40px;
      }
      .padded {
        /* internal space on all sides */
        padding: 20px;
        background-color: #d4f0f0;
      }
    </style>
  </head>
  <body>
    <p>
      <span class="gap-right">Start</span>End
    </p>
    <p class="spaced">This paragraph has 40px of space below it.</p>
    <p class="padded">This paragraph has 20px of padding inside it.</p>
  </body>
</html>

Result

Espaçamento uniforme entre itens com `gap`

Quando você organiza itens com Flexbox ou CSS Grid, a propriedade gap adiciona espaço consistente entre eles sem afetar as margens próprias dos itens:

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      .row {
        display: flex;
        gap: 24px; /* space between every item */
      }
      .row > div {
        padding: 10px 16px;
        background-color: #d4f0f0;
      }
    </style>
  </head>
  <body>
    <div class="row">
      <div>One</div>
      <div>Two</div>
      <div>Three</div>
    </div>
  </body>
</html>

Result

Outras formas de adicionar espaço

Dependendo do que você precisa, estas opções padrão de HTML e CSS também ajudam a controlar o espaço em branco:

A tag <p> cria uma quebra de parágrafo com espaçamento padrão acima e abaixo.
A tag <br> insere uma única quebra de linha.
A tag <pre> preserva o texto pré-formatado, de modo que linhas em branco e espaços aparecem exatamente como escritos no HTML.
A entidade de caractere   cria um espaço sem quebra.
O caractere 	 é uma tabulação. Geralmente precisa de texto ao redor ou de CSS como white-space: pre para ser renderizado visivelmente.

Atributos legados (para referência)

Esses atributos pertenciam à tag obsoleta <spacer>. Estão listados apenas para que você possa reconhecê-los em marcações antigas — nenhum deles funciona hoje.

Atributo	Valor	Descrição
align	`left`, `right`, `center`	Alinhamento de um espaçador do tipo `block`.
size	número de pixels	Tamanho do espaço vazio para espaçadores `horizontal` ou `vertical`.
width	número de pixels	Largura do espaço vazio para um espaçador do tipo `block`.
height	número de pixels	Altura do espaço vazio para um espaçador do tipo `block`.
type	`horizontal`, `vertical`, `block`	Direção/forma do espaçador.

Prática

Qual afirmação sobre a tag HTML spacer está correta?

É um elemento obsoleto do Netscape que nenhum navegador moderno suporta, portanto você deve usar CSS em seu lugar.Faz parte do padrão HTML atual e funciona em todos os navegadores.É a forma recomendada de adicionar espaço entre itens flex.Adiciona uma borda ao redor de um elemento.