você pode adicionar quebras de linha à: após elemento pseudo?

Question

Eu quero acrescentar uma <br /> a uma classe particular. Usando o:. Depois da aula pseudo simplesmente exibe <br /> como texto

Existe uma maneira de fazer este trabalho?

É interno para IE8 para que os problemas do navegador não são um problema. Se eu fizer

<span class="linebreakclass">cats are</span> brilliant

Eu quero "brilhante" para aparecer em uma nova linha.

Answer 1

Você não será capaz de processar tags HTML, mas você pode definir o estilo parecido com isto:

.needs-space:after
{
    content: " ";
    display: block;
    clear: both; /* if you need to break floating elements */
}

A configuração principal aqui é display: block; Este irá processar : depois de conteúdo dentro de um DIV. E este elemento pseudo é suportado por todos os navegadores mais recentes. Incluindo o IE. Dizendo isso, você deve estar ciente de seus usuários e seus navegadores.

Answer 2

Você pode usar seqüência \A escape, o que tornará como uma nova linha:

.new-line:after {
  white-space: pre-wrap;
  content: "\A";
}

Este método foi mencionado no CCS 2.1 Especificação para a propriedade content:

Os autores podem incluir novas linhas no conteúdo gerado por escrito o sequência de escape "\A" em uma das cordas após a 'content' propriedade. Esta quebra de linha inserido ainda está sujeita à 'white-space' propriedade.

Answer 3

E fica ainda pior - o:. Depois da aula nem sequer funciona no IE6 (e provavelmente alguns outros navegadores também)

Eu acho que você realmente quer aqui é uma margem na parte inferior do elemento, para fornecer espaçamento.

Simplesmente

.myElement {
    margin-bottom: 1em;
}