Ir para conteúdo

POWERED BY:

Arquivado

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

Antoniosp

Div com scroll horizontal

Por , em Desenvolvimento frontend

Recommended Posts

Antoniosp    2

Antoniosp
Postado

E aí pessoal B)

 

Seguinte: eu tenho umas divs com float:left. Todas estão dentro de uma outra div geral. O problema é:

Quando acaba o espaço horizontal para as "float:left", elas pulam pra uma linha abaixo, certo? Mas eu não quero isso. Tipo, queria q formasse uma barra de scroll horizontal na div geral pra q elas ficam todas na mesma linha... http://forum.imasters.com.br/public/style_emoticons/default/ermm.gif

 

Alguem sabe? http://forum.imasters.com.br/public/style_emoticons/default/grin.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites

micox    2

micox
Postado

Pois é brodi, infelizmente isso é impossível (até onde vai meu conhecimento). A não ser que você sete a largura do div pai explicitamente.

 

Eu considero isso uma falha do CSS2 (um dia espero fazer um compilado de desvantagens no CSS2 e que poderiam ser melhoradas).

 

Dá uma lida neste post aqui:

http://forum.imasters.com.br/index.php?s=&...ndpost&p=515034

 

Nele tem uma discussão sobre esse lance horizontal...

Compartilhar este post

Link para o post
Compartilhar em outros sites

Antoniosp    2

Antoniosp
Postado

Então micox, a idéia é q a div "pai" seja setada explicitamente mesmo.

O problema é q se eu coloco um monte de 'div float:left' dentro de uma outra div (pai) e seto o overflow desta última em 'scroll', as divs continuam descendo e cria-se uma barra vertical, e não horizontal...

 

Tem como?

Compartilhar este post

Link para o post
Compartilhar em outros sites

micox    2

micox
Postado

Agora acho que não entendi direito o que você quer, mas veja se esse código ajuda. Fiz para 2 casos, se um não servir (pai), o outro vai servir (paipai2):

 

<html><style>* { margin:0px; padding: 0px;}#pai {border: 1px solid blue; width: 2000px; height:110px; overflow: scroll;}#pai div { border: 1px solid green; float:left; width:100px; height:100px; }#paipai2 { overflow: scroll; }#pai2 {border: 1px solid blue; width: 2000px; height:110px; }#pai2 div { border: 1px solid green; float:left; width:100px; height:100px; }</style><script></script><body><div id="pai"><div >a</div><div >b</div><div >c</div><div >d</div><div ></div><div ></div><div ></div><div ></div><div ></div><div ></div><div ></div><div ></div><div ></div><div ></div></div> <!-- fim pai --><div id="paipai2"><div id="pai2"><div >a</div><div >b</div><div >c</div><div >d</div><div ></div><div ></div><div ></div><div ></div><div ></div><div ></div><div ></div><div ></div><div ></div><div ></div></div> <!-- fim pai --></div> <!-- fim paipai2 --></body>

Ah e eu faço questão que você entenda o que eu fiz. Se não entender, postae...

Compartilhar este post

Link para o post
Compartilhar em outros sites

Antoniosp    2

Antoniosp
Postado

Hum... saquei sim, pode ficar sussegado, hehe. http://forum.imasters.com.br/public/style_emoticons/default/graduated.gif

 

E de quebra eu fiz uma gambiarrazinha: a barra vertical continua lá, não está acionada, mas fica lá só atrapalhando o layout. Botei mais uma div por fora com overflow: hidden e aumentei a largura da 'paipai2' assim a barra não aparece, hehehe. :D

 

Mudando de assunto: agora q começei a explorar o CSS e etc percebi: como o IE é uma porcaria hein? caramba! Sai tudo diferente! E depois a gente q tem q pagar o pato pra consertar... <_<

 

Valeu aí pela dica, flw. http://forum.imasters.com.br/public/style_emoticons/default/yay.gif

Compartilhar este post

Link para o post
Compartilhar em outros sites

micox    2

micox
Postado

E de quebra eu fiz uma gambiarrazinha: a barra vertical continua lá, não está acionada, mas fica lá só atrapalhando o layout. Botei mais uma div por fora com overflow: hidden e aumentei a largura da 'paipai2' assim a barra não aparece, hehehe.

Deve ter ficado bom então. heheh

Mudando de assunto: agora q começei a explorar o CSS e etc percebi: como o IE é uma porcaria hein? caramba! Sai tudo diferente!

hehe. É verdade, mas com o tempo você vai ver que não é só o IE que tem problemas.. heheh. O próprio CSS dá muito trabalho as vezes... Esperamos que em versões novas o negócio venha melhor resolvido...falows...

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

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

  Aceito