Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá
Eu preciso encaixar as div's de forma dinâmica, sem utilizar position: absolute, nem margin-top, eu gostaria de utilizar algo como float:
Veja essa imagem:
Meu Código:
<!DOCTYPE html>
<html>
<head>
<style>
</style>
<script src="/scripts/snippet-javascript-console.min.js?v=1"></script>
</head>
<body>
<div style="float: left; width: 100px; height: 50px; background-color: #CCCCCC; border-style: solid; border-size: 1; border-color: #FFFFFF;">1</div>
<div style="float: left; width: 100px; height: 50px; background-color: #CCCCCC; border-style: solid; border-size: 1; border-color: #FFFFFF;">2</div>
<div style="float: left; width: 200px; height: 200px; background-color: #CCCCCC; border-style: solid; border-size: 1; border-color: #FFFFFF;">3</div>
<!-- Fazer essa div abaixo se alinha a esquerda na linha de baixo -->
<div style="position: relative; float: left; width: 100px; height: 70px; background-color: #CCCCCC; border-style: solid; border-size: 1; border-color: #FFFFFF; clear: left;">4</div>
<script type="text/javascript">
</script>
</body>
</html>Obrigado
>
Ja passei por esse problema,veja se isso lhe ajuda:
Bakana demais
3dmaniaco,
Hoje você tem o Masonry (plugin JS) que faz o mesmo que pediu e também tem o panel stacks que vem junto do Bootstrap 4.
Abraços!
ok, vou análisar o Mansory.
>
3dmaniaco,
Hoje você tem o Masonry (plugin JS) que faz o mesmo que pediu e também tem o panel stacks que vem junto do Bootstrap 4.
Abraços!
Olá L. Henrique. Tudo Bem ? Cara, você me ajudaria utilizar o Mansory ? Eu gostaria de saber como fazer meu codigo acima, a funcionar com o mansory, utilizando uma unica coluna. Você me ajuda ? Obrigado Cara.
Ja passei por esse problema,veja se isso lhe ajuda:
http://pt.stackoverflow.com/questions/160650/div-preencher-espaço-em-branco?noredirect=1#comment331107_160650