Inserir discreto vertical discretamente no layout

StackOverflow https://stackoverflow.com/questions/4607500

  •  25-09-2019
  •  | 
  •  

Pergunta

Quero inserir um divisor vertical cinza que divide os dois lados uniformemente para mostrar uma divisão lógica. Como o conteúdo dos dois lados pode variar em altura, dependendo do que o usuário seleciona, o divisor precisa escalar adequadamente - em outras palavras, não pode ser altura fixa.

Como um aparte, idealmente esse elemento de estilo seria algo que eu poderia inserir e remover condicionalmente. Obviamente, algum tipo de div daria o máximo de controle.

Aqui está o meu código HTML/CSS existente:

http://jsfiddle.net/keruilin/u5ggt/47/

Foi útil?

Solução

Em vez de inserir um elemento, eu examinaria o estilo dos dois lados como colunas de altura igual. Use uma direita na fronteira no lado esquerdo ou na esquerda à direita, para mostrar a divisão.

Ver: CSS - Colunas de altura igual? Para orientações sobre colunas de altura igual.

Outras dicas

Que tal você se inscrever border-left: 2px solid gray ou border-right: 2px solid gray para uma das colunas?

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top