rodape estoura para o lado quando diminui a tela

[fabio.aurelio 0]

Ola pessoal,

 

Estou mexeno num rodape e me deparei com o problema acima, fazendo os testes num monitor com configuracao 1920x1080 deu certo, ficou alinhado.

 

Mas resolvi diminui a configuracao da tela, e ai o rodape comela invadir o lado direito da tela..e fica aquela coluna branca

 

o codigo é esse:

 

  <div id="rodape">
      <h2>Paisagens</h2>
                <table>
                    <tr><td><a href="http://www.testeimg.org.br/" target="_blank"><img src="i/img1.png?v=2" /></a></td><td><a href="http://www.testeimg.com.br/" target="_blank"><img src="i/img2.png" /></a></td><td><a href="http://testeimg.com/" target="_blank"><img src="i/img3.png"/></a></td><td><a href="http://testeimg.com/" target="_blank"><img src="i/img4.png"/></a></td><td><a href="http://www.testeimg.com/" target="_blank"><img src="i/img5.png" /></a></td></tr>
                    <tr>
                </table>
            
        </div>

 

Css:

 

 #rodape table td {
                text-align: center;
                padding: 15px;
				
				
            }

  #rodape {
                background:url(img/fundo.jpg) repeat-x #1CCCC;
                height: 100px;
                text-align: left;
		min-width:1024px;
            }

 

 

Queria deixar ela fixa, pois quando a tela fosse menor, ele deveria ficar fixo e nao invadir o lado da tela..

[crf_h0m3r 5]

Pode tirar um print do problema?

[fabio.aurelio 0]

tem sim, segue abaixo

 

[Ricardo Barantini 33]

Altera o min-width do #rodape pra max-width.

[EduardoAugustoPHP 27]

Altera o min-width do #rodape pra max-width.

 

Mano...

um conselho?

Tira isso das tabelas e faz com divs's com position relative e float:left para cada box....aiiii

Vc faz o que o amigo ai disse: altera o min por max.

 

Abs

[fabio.aurelio 0]

Mano...

um conselho?

Tira isso das tabelas e faz com divs's com position relative e float:left para cada box....aiiii

Vc faz o que o amigo ai disse: altera o min por max.

 

Abs

 

 

Entao, fiz isso, mas agora, quando diminuo a tela ele joga as imagens para baixo..

[Ricardo Barantini 33]

Você está usando float: left ou float: right em alguma div? Se estiver precisa usar o clear: both em uma div logo abaixo delas.

[fabio.aurelio 0]

Você está usando float: left ou float: right em alguma div? Se estiver precisa usar o clear: both em uma div logo abaixo delas.

 

Entao, estou usando, mas tirei ela e nao esta fazendo diferença.

[Ricardo Barantini 33]

O certo é você remover as tabelas mesmo, não é legal trabalhar com elas assim, utilize div, tableless está ai para isso, fica mais fácil de resolver seu problema. Se possível poste seu código HTML e CSS completo.

[bruno_mosciatti 22]

Remova as tabelas, trabalhe com <ul> <li>, defina largura e altura para os elementos e mande flutuar à esquerda.

[fabio.aurelio 0]

Vou fazer o teste!

 

Mas na real eu ja tinha removido as tabelas...meio arcaico elas

 

aqui esta o codigo novo:

 

 <div id="rodape">
   <ul>
<li><a href="http://www.teste.br/" target="_blank"><img src="i/img1.png?v=2" /></a></li>
<li><a href="http://www.teste.com.br/" target="_blank"><img src="i/img2.png" /></a></li>
<li> <a href="http://teste.com.br/" target="_blank"><img src="i/img3.png"/></a></li>	
<li> <a href="http://teste.com.br/" target="_blank"><img src="i/img4.png"/></a></li>	
<li> <a href="http://www.teste.com.br/" target="_blank"><img src="i/img5.png" /></a></li>
   </ul>

 </div>

 

 

 

 

css :

 

	#rodape ul{
		   background:url(i/fundo.jpg) repeat-x #1E1C1C;
			padding:0px;
			float: left;
			height: 300px
			width:1024px;
				}
	
		#rodape ul li  {
		padding: 2px 10px;
			float:left;
			
		}

[bruno_mosciatti 22]

Vou fazer o teste!

 

Mas na real eu ja tinha removido as tabelas...meio arcaico elas

 

aqui esta o codigo novo:

 

<div id="rodape">   <ul><li><a href="http://www.teste.br/" target="_blank"><img src="i/img1.png?v=2" /></a></li><li><a href="http://www.teste.com.br/" target="_blank"><img src="i/img2.png" /></a></li><li> <a href="http://teste.com.br/" target="_blank"><img src="i/img3.png"/></a></li>	<li> <a href="http://teste.com.br/" target="_blank"><img src="i/img4.png"/></a></li>	<li> <a href="http://www.teste.com.br/" target="_blank"><img src="i/img5.png" /></a></li>   </ul> </div>

 

 

 

css :

#rodape ul{		   background:url(i/fundo.jpg) repeat-x #1E1C1C;			padding:0px;			float: left;			height: 300px			width:1024px;				}			#rodape ul li  {		padding: 2px 10px;			float:left;					}

Defina tamanho (height e width) para a li e para o <a> e para a imagem do <a>

 

Lembre-se que você deve definir tudo com clareza, sempre. Os elementos devem ter tamanhos definidos e o seu float. Assim, você estará conseguindo manter o código limpo e rodando em todos navegadores, pois os mais antigos com o IE7/IE8 não interpretam certas coisas e por isso declaramos tudo com clareza.

[fabio.aurelio 0]

Defina tamanho (height e width) para a li e para o <a> e para a imagem do <a>

 

Lembre-se que você deve definir tudo com clareza, sempre. Os elementos devem ter tamanhos definidos e o seu float. Assim, você estará conseguindo manter o código limpo e rodando em todos navegadores, pois os mais antigos com o IE7/IE8 não interpretam certas coisas e por isso declaramos tudo com clareza.

 

Nao deu certo....acontece a mesma coisa, quando diminuo a tela, ele joga pra baixo....ta complciado

[Ricardo Barantini 33]

min-width: 100% no #rodape.

 

Comprime essa sua página HTML e o CSS em um arquivo .rar ou .zip e no meu e-mail (ricardobarantini@gmail.com) para ver como está tudo, isso está muito estranho.

[Giovani 104]

Seria mais prático postar um link para galera visualizar todo o código ;)

[fabio.aurelio 0]

Seria mais prático postar um link para galera visualizar todo o código ;)

como assim Giovani?? n entendi..

[fabio.aurelio 0]

Pronto galera,

 

coloquei no pastebin o codigo para visualizar

 

http://pastebin.com/QW9pGnt3

 

vlw pela força

[tatiana schyneider 1]

Não seria melhor um div para todos, e depois, um para cada imagem? já que elas são fixas?

[fabio.aurelio 0]

Eu já fiz isso, mas quando nao estoura para o lado, ele joga as figuras para baixo..

 

Mais alguém tem alguma dica pessoal?

[lucastdl 0]

tá difícil heim!