Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Então galera, minha duvida é a seguinte: tenho 3 sections, e quero que uma fique a esquerda, outra no meio e outra a direita do layout liquido (100%). As sections tem 310px de largura, como eu faria essa margem?
ex:
<section id="container" style="position:relative;width:100%;height:auto;">
<section id="sleft"></section>
<section id="scenter"></section>
<section id="sright"></section>
</section>Tá aqui um exemplo simples de como fazer
http://jsfiddle.net/samuelgoes/taS2D/
qualquer dúvida só comentar
>
Você pode usar a propriedade float e margin:auto do CSS. Exemplo:
<style>
#sleft{
width:310px;#scenter{
width:310px;#sright{
width:310px;</style>
<section id="container" style="position:relative;width:100%;height:auto;">
<section id="sleft"></section>
<section id="scenter"></section>
<section id="sright"></section>
</section>Espero ter Ajudado!
então mano desse modo vc esta tirando o float da div central pro margin ter efeito, e a div da direita vai para baixo.
E tbm nao funciona pois qdo o site for redimensionado quero que as 3 divs vao ficando uma em baixo da outra
>
então mano desse modo você esta tirando o float da div central pro margin ter efeito, e a div da direita vai para baixo.
E tbm nao funciona pois qdo o site for redimensionado quero que as 3 divs vao ficando uma em baixo da outra
.container{
width:300px;// a seu gosto
height:400px; a seu gosto
background:gray;
}.container > div {
width:130px; //Edite a seu gosto
height:100%; // a seu gosto
position:relative;
float:left;
border:1px solid red;
}
<div class="container">
<div></div>
<div></div>
<div></div>
</div>>
.container{
width:300px;// a seu gosto
height:400px; a seu gosto
background:gray;
}.container > div {
width:130px; //Edite a seu gosto
height:100%; // a seu gosto
position:relative;
float:left;
border:1px solid red;
}
<div class="container">
<div></div>
<div></div>
<div></div>
</div>Tbm ñ deu certo :/
estou tentando ver sites que tem as 3 colunas pra mim tentar pegar o fonte de exemplo
Se alguem souber por favor me ajude ?
>
Tbm ñ deu certo :/
estou tentando ver sites que tem as 3 colunas pra mim tentar pegar o fonte de exemplo
Se alguem souber por favor me ajude ?
Dá uma olhada no teu código fonte, as vezes dá erro por mal estruturação do html
Dá uma olhada no teu código fonte, as vezes dá erro por mal estruturação do html
Olá samoel, obrigado por estar tentando me ajudar !
Então, eu coloquei tudo certinho ja mexo com desenvolvimento ja faz um tempo mas nunca peguei algo assim.
O codigo q vc postou uma das divs ficou em baixo, eu quero que uma fique totalmente a direita e outra a esquerda e uma no centro, mas acho q nao tem jeito :/
>
Olá samoel, obrigado por estar tentando me ajudar !
Então, eu coloquei tudo certinho ja mexo com desenvolvimento ja faz um tempo mas nunca peguei algo assim.
O codigo q você postou uma das divs ficou em baixo, eu quero que uma fique totalmente a direita e outra a esquerda e uma no centro, mas acho q nao tem jeito :/
Veja se a width está muito grande. Coloque um tamanho bem pequeno para testar. se ficarem alinhadas está certinho, depois apenas ajuste.
Estava com o mesmo problema que o seu. Com o code dele consegui resolver
>
Olá samoel, obrigado por estar tentando me ajudar !
Então, eu coloquei tudo certinho ja mexo com desenvolvimento ja faz um tempo mas nunca peguei algo assim.
O codigo q você postou uma das divs ficou em baixo, eu quero que uma fique totalmente a direita e outra a esquerda e uma no centro, mas acho q nao tem jeito :/
Uma ficou a baixo por que você botou um width que não cabe todas alinhadas
muda o width do container ou diminui os das divs e veja.
>
Uma ficou a baixo por que você botou um width que não cabe todas alinhadas
muda o width do container ou diminui os das divs e veja.
Então eu fiz isso tb, elas ficaram lado a lado, mas como é um layout liquido eu quero que elas fiquem totalmente a direita outra no centro e outra a esquerda
Se o que você quer é que as divs não fiquem abaixo uma das outras, faz isso
http://jsfiddle.net/samuelgoes/taS2D/1/
se for para que elas quebrem é só fazer o que eu disse antes...
você fala que quer uma totalmente a direita, outra a esquerda e outra no centro,
mas é exatamente isso que eu te mostrei... tem 3 divs , uma a direita, uma no meio e outra a esquerda.
mas vamos fazer assim...
http://jsfiddle.net/samuelgoes/k8rrc/
assim, elas diminuem e tbm pulam para parte de baixo se for necessario.
se n for isso, então n sei
Você pode usar a propriedade float e margin:auto do CSS. Exemplo:
height:200px; //Exemplo backgroud:#ccc; //Exemplo float:left; // Alinhar left } height:200px; //Exemplo backgroud:#ccc; //Exemplo margin:auto; // Alinhar center } height:200px; //Exemplo backgroud:#ccc; //Exemplo float:right; // Alinhar right }Espero ter Ajudado!