📣 Seu anúncio aqui? Anuncie no ForoBeta

O background-repeat não funciona no Firefox?

  • Autor Autor mcloud
  • Data de início Data de início
Tradução em andamento: em alguns minutos este tópico estará em português. Por enquanto, o conteúdo está no original em espanhol. Ver original
M

mcloud

Ni
Usuário com poucas negociações! Use sempre o saldo do ForoBeta!
A ver si alguien puede ayudarme a entender porqué no se vé igual un estilo en IE y en Firefox.

Intentaré explicar el problema que tengo. Estoy haciendo un estilo, el cual tiene en el header varias celdas, el problema es que con IE se visualiza como si fuera fluid y en Firefox como si fuera fixed.

Creo que el problema está en la primera de las celdas que podeis ver en las imágenes que adjunto. En IE se repite hasta llenar todo el ancho de la pantalla, pero en Firefox no ocurre eso. Son las celdas <td class=head_05> y <td class=head_18>. ¿Será que no funciona background-repeat con Firefox?

La imagen bnr_04_tile.gif tiene 2px de ancho y la bnr_12_tile.gif 8 px de ancho

El código es el siguiente:

CSS:
HTML: 
td.head_01{width:51px;height:187px;}
td.head_02{width:50px;background-image:url("http://www.vbhispano.com/foros/images/misc/bnr_02.gif");background-repeat:no-repeat;}
td.head_03{width:51px;background-image:url("http://www.vbhispano.com/foros/images/misc/bnr_03.gif");background-repeat:no-repeat;}
td.head_04{width:51px;background-image:url("http://www.vbhispano.com/foros/images/misc/bnr_04.gif");background-repeat:no-repeat;}
td.head_05{background-image:url("http://www.vbhispano.com/foros/images/misc/bnr_04_tile.gif");background-repeat:repeat-x;}
td.head_06{width:51px;height:75px;}
td.head_07{width:51px;background-image:url("http://www.vbhispano.com/foros/images/misc/bnr_u_01_02.gif");background-repeat:no-repeat;}
td.head_08{width:51px;background-image:url("http://www.vbhispano.com/foros/images/misc/bnr_u_02.gif");background-repeat:no-repeat;}
td.head_09{width:51px;background-image:url("http://www.vbhispano.com/foros/images/misc/bnr_u_03.gif");background-repeat:no-repeat;}
td.head_10{width:51px;background-image:url("http://www.vbhispano.com/foros/images/misc/bnr_u_04_01.gif");background-repeat:no-repeat;}
td.head_11{width:51px;background-image:url("http://www.vbhispano.com/foros/images/misc/bnr_05.gif");background-repeat:no-repeat;}
td.head_12{width:51px;background-image:url("http://www.vbhispano.com/foros/images/misc/bnr_06.gif");background-repeat:no-repeat;}
td.head_13{width:51px;background-image:url("http://www.vbhispano.com/foros/images/misc/bnr_07.gif");background-repeat:no-repeat;}
td.head_14{width:51px;height:83px;}
td.head_15{width:50px;background-image:url("http://www.vbhispano.com/foros/images/misc/bnr_10.jpg");background-repeat:no-repeat;}
td.head_16{width:51px;background-image:url("http://www.vbhispano.com/foros/images/misc/bnr_11.jpg");background-repeat:no-repeat;}
td.head_17{width:51px;background-image:url("http://www.vbhispano.com/foros/images/misc/bnr_12.gif");background-repeat:no-repeat;}
td.head_18{background-image:url("http://www.vbhispano.com/foros/images/misc/bnr_12_tile.gif");background-repeat:repeat-x;}
td.head_19{width:51px;background-image:url("http://www.vbhispano.com/foros/images/misc/bnr_13.gif");background-repeat:no-repeat;}
td.head_20{width:51px;background-image:url("http://www.vbhispano.com/foros/images/misc/bnr_14.jpg");background-repeat:no-repeat;}
td.head_21{width:51px;background-image:url("http://www.vbhispano.com/foros/images/misc/bnr_15.jpg");background-repeat:no-repeat;}
TABLA:
HTML: 
<td><table width=100%" border="2" cellspacing="0" cellpadding="0">
       <tr>
         <td class=head_05>&nbsp;</td>
         <td class=head_11><img src=images/misc/spacer.gif alt="" width="51" height="1"></td>
         <td class=head_12><img src=images/misc/spacer.gif alt="" width="51" height="1"></td>
         <td class=head_13><img src=images/misc/spacer.gif alt="" width="51" height="1"></td>
         <td class=head_01><img src=images/misc/bnr_08.gif alt="" width="51" height="187"></td>
       </tr>
       <tr>
         <td class=head_18>&nbsp;</td>
         <td class=head_19><img src=images/misc/spacer.gif alt="" width="51" height="1"></td>
         <td class=head_20><img src=images/misc/spacer.gif alt="" width="51" height="1"></td>
         <td class=head_21><img src=images/misc/spacer.gif alt="" width="50" height="1"></td>
         <td class=head_14><img src=images/misc/bnr_16.gif alt="" width="51" height="83"></td>
       </tr>
     </table></td>
IMAGENES:
29703907rw3.gif

Internet Explorer​

firefoxak7.gif

Firefox​

Para cualquier aclaración, no dudeis en preguntar.​

Ah!, ya sé que podría hacerlo con tablas, sin utilizar clases CSS, pero esto me tiene un poco confundido y quisiera aclararlo.​

Un saludo​
 
Foi útil? Participe da conversa

Com sua conta grátis você pode responder, mandar mensagem privada ao autor e comprar com Saldo retido: o pagamento é liberado quando você recebe o combinado.

Continuar com o Google Criar conta com e-mail
Leva 30 segundos · você volta a este tópico ao terminar
Usa:
Inserir CODE, HTML ou PHP: 
td.head_05{background:url("http://www.vbhispano.com/foros/images/misc/bnr_04_tile.gif") repeat-x;}
Inserir CODE, HTML ou PHP: 
td.head_18{background:url("http://www.vbhispano.com/foros/images/misc/bnr_12_tile.gif") repeat-x;}
 
Lo había probado tambien así, pero no cambia nada.
 
veo que la tabla esta dentro de otra tabla (TD) no estará por ahi tu problema?, osea. el 100% de tu tabla es el ancho maximo de ese TD
 
La tabla que contiene todo el header tiene un ancho del 100%, por lo que creo que por ahí no está el problema.

Lo que me tiene confundido es que en IE el ancho del header se acopla al ancho de la ventana, como no podía ser de otra manera, pero no ocurre así con el Firefox.

Pensé que quizás hubiera problemas con el repeat, pero realmente si que se repite, aunque no todo lo que debiera.

Parece como si en algún sitio hubiera un ancho que delimita al header, pero no lo hay.

Volveré a revisar todo el código, a ver si se me escapó algo.

Ah! Feliz Año Nuevo Jhonnyf. Me alegra verte de nuevo por aquí después de estas fiestas 🙂
 
Veo que en el ancho falta un ":
Inserir CODE, HTML ou PHP: 
<td><table [COLOR=Red]width=100%"[/COLOR] border="2" cellspacing="0" cellpadding="0">
       <tr>
         <td class=head_05>&nbsp;</td>
         <td class=head_11><img src=images/misc/spacer.gif alt="" width="51" height="1"></td>
         <td class=head_12><img src=images/misc/spacer.gif alt="" width="51" height="1"></td>
         <td class=head_13><img src=images/misc/spacer.gif alt="" width="51" height="1"></td>
         <td class=head_01><img src=images/misc/bnr_08.gif alt="" width="51" height="187"></td>
       </tr>
       <tr>
         <td class=head_18>&nbsp;</td>
         <td class=head_19><img src=images/misc/spacer.gif alt="" width="51" height="1"></td>
         <td class=head_20><img src=images/misc/spacer.gif alt="" width="51" height="1"></td>
         <td class=head_21><img src=images/misc/spacer.gif alt="" width="50" height="1"></td>
         <td class=head_14><img src=images/misc/bnr_16.gif alt="" width="51" height="83"></td>
       </tr>
     </table></td>
 
Parece no haber manera de que IE y Firefox muestren igual la cabecera.

Aquí adjunto el código de la cabecera y las imágenes para que podais verlo mejor. He elimiando del CSS lo que no afecta, para que haya menos código 🙂

Creo que al final tendré que hacerlo sin css, aunque me da rabia no encontrar el error.

Gracias por vuestra paciencia.

Un saludo
 
mcloud,
tu código no esta muy bien escrito, deberías encerrar cada valor en comillas, si lo pusiste así a proposito entonces ignora lo que digo 😛.
Esas imágenes de arriba son capturas de tu estilo actual? podrias ver el codigo fuent de esa parte y pegarlo acá? otra cosa no le des width: ni height: con css, utiliza width="x" y height="x" directamente en las etiquetas html. No utilizes height para nada, el alto de la imagen hará que la celda quede en su lugar.

Si lo que quieres esque la primera celda se alargue al 100%, entonces dale width="100%" solo a esa celda a las demás dales un ancho fijo pero no por css.

Si quieres dar ancho por css, mejor crea un div dentro de la celda, haslo un bloque y le das height: y width: y a ese div le das un background no repeat de tu imágen, así no utilizas <img dentro de la celda y en ves se lo das al div... no se si me entiendas.

Si puedes pon acá todo el código de esa parte 😉

Inserir CODE, HTML ou PHP: 
<td><table width=100%" border="2" cellspacing="0" cellpadding="0">
       <tr>
         <td class=[COLOR=Red]head_05[/COLOR]>&nbsp;</td>
         <td class=[COLOR=Red]head_11[/COLOR]><img src=[COLOR=Red]images/misc/spacer.gif[/COLOR] alt="" width="51" height="1"></td>
         <td class=[COLOR=Red]head_12[/COLOR]><img src=[COLOR=Red]images/misc/spacer.gif[/COLOR] alt="" width="51" height="1"></td>
         <td class=[COLOR=Red]head_13[/COLOR]><img src=[COLOR=Red]images/misc/spacer.gif[/COLOR] alt="" width="51" height="1"></td>
         <td class=[COLOR=Red]head_01[/COLOR]><img src=[COLOR=Red]images/misc/bnr_08.gif [/COLOR]alt="" width="51" height="187"></td>
       </tr>
 
Perdón, se me olvidó añadir el adjunto con el código y las imagenes. Ahora si está.

Gracias Elmer, revisaré eso que me dices.
 
Elimita POSITION: absolute; de tu div, el q sta despues de <body>
o sea que quede asi:
HTML: 
<DIV style="LEFT:0px; TOP:0px">
eso hara que se haga fluid para ambos navegadores, y si lo quieres fixed, utiliza el div que te dejo abajo 😉

HTML: 
<DIV style="width: 900px; margin-left:auto; margin-right:auto;">
 
Ahí estaba el problema!!!!

Había buscado como loco que era lo que causaba el problema en Firefox. En ningún otro estilo me había pasado esto.

Ahora parece tan fácil la solución! 😀

Gracias Elmer. Te debo una 😉
 
Você precisa estar logado ou cadastrado para responder aqui.

Tópicos similares

H
Erro em background
Respostas
6
Visitas
800
Melvin Garcia
Melvin Garcia
D
Não funciona no firefox
Respostas
7
Visitas
544
Usuario eliminado 67833
U
H
problema theme não funciona no firefox
Respostas
1
Visitas
745
jjuuaannk
J
Voltar
Topo