Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Pedro Roccon

Conteúdo maior que uma div continuar flutuando à esquerda

Recommended Posts

Olá galera, bom dia.

 

Estou com uma dúvida que acredito que seja meio básica. Tenho uma div com 800px de largura e dentro dessa div tenho vários elementos com 200px de largura, ficando assim:

.container {
  position: relative;
  width: 800px;
  height: 200px;
}

.elements {
  position: relative;
  float: left;
  width: 200px;
  height: 200px;
}

E meu HTML fica do seguinte jeito:

<div class="container">
   <div class="elements"></div>
   <div class="elements"></div>
   <div class="elements"></div>
   <div class="elements"></div>
   <div class="elements"></div>
   <div class="elements"></div>
   <div class="elements"></div>
</div>

E claro, o tamanho dos elementos ultrapassa o do container. Porém eu gostaria que se caso os elementos ultrapassassem o tamanho do container, ao invés dos elementos "caírem" para baixo eles continuassem flutuando à esquerda, pois tenho ideia de colocar tipo 1 scroll. Mas atenção não posso formar aquela barra de scroll, então acredito que o overflow-x: scroll; não é uma solução.

 

Alguém poderia me ajudar por favor?

Desde já agradeço e muito obrigado por se interessarem no tópico :D

Compartilhar este post


Link para o post
Compartilhar em outros sites

Eu não entendi muito bem parceiro, você quer fazer um carousel?

Compartilhar este post


Link para o post
Compartilhar em outros sites

Ronaldo, tentei o que você me falou porém as divs que estão dentro do container quando atingem o limite máximo começam a cair para baixo. Gostaria que elas continuassem enfileiradas mesmo que o tamanho ultrapasse o container.

Compartilhar este post


Link para o post
Compartilhar em outros sites

vc precisa de 2 elementos.

 

um para ter largura suficiente para caber todas as DIVs, e outro pai desse para ter a largura menor com overflow: hidden;

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.