Solucionado
Olá,
Tenho uma dúvida que ainda não achei uma solução satisfatória
Tendo 3 divs, gostaria de um CSS para inserir espaçamento entre elas, mas não nas bordas externa.
Por exemplo, deveria ficar assim:
<div>( )<div>( )<div>
E não ( )<div>( )<div>( )<div>( )
ou <div>( )<div>( )<div>( )
Também não desejo usar flex.
Olá Naun, tudo bem?
Se as suas divs estão posicionadas uma ao lado da outra, você poderia aplicar um espaçamento somente na div do meio.
Ou seja, a div central teria um espaçamento definido para esquerda e direita, dessa forma, o resultado seria o que você deseja.
Abraços!
Olá, obrigado pela resposta, mas na verdade o exemplo foi genérico. Eu queria uma solução para n divs lado a lado ou uma abaixo da outra.
Olá Naun, tudo bem? Bom, você poderia usar margin pra resolver seu problema, como por exemplo:
<div></div>
<div class="caixa"></div>
<div></div>
div{
display: inline;
}
.caixa{
margin: 0 25%;
}Entretanto, não ficaria responsivo. Logo, a melhor solução seria usar um flexbox mesmo.
Oi Naun,
Entendi agora.
Existem algumas formas de solucionar isso, vou deixar duas abaixo para você:
1 - Apenas divs precedidas de div serão estilizadas.
div + div {
margin-left: 10px;
}2 - Utilização de uma pseudo-classe CSS3
div {
margin: 0 10px;
}
div:first-of-type {
margin-left: 0;
}
div:last-of-type {
margin-right: 0;Provavelmente existem outras soluções. Como sabemos, existem diversas formas de resolver um mesmo problema.
Acredito que com esses dois exemplos você terá um caminho bom para seguir, adote um e utilize.
Espero que seja isso que busca.
Abraços!
Perfeito Paulo, muito obrigado. Era isso mesmo que eu desejava.
Fico feliz em ajudar!
Estou fechando o tópico agora! Qualquer nova dúvida basta criar uma nova thread!
Abraços!