se ve pero no se ve, ese es el dilema

[ezra.wong]

que tal, tengo un detalle con IE7 y el buenisimo de FF el cual consiste en

tengo la estructura basica

Código HTML:

<div id="header"></div>
<div id="sidebar"></div>
<div id="content"></div>
<div id="footer"></div> 

y agrego imagenes desde un css, osea que en el header le aplico algo asi:

Código HTML:

#header{
backgorund: url(imagen.png);
height:120px;
}

y en IE todo bien pero en FF no se ve nada a menos que omita la imagen desde la css y haga esto:

Código HTML:

<div id="header"><img src="imagen.png"></div> 

la pregunta es porque???
existe alguna alternativa???

he visto que algunos diseñadores duplican codigo en el CSS, unno para la implementacion de FF y otro para el fregado IE.

[AlvaroG]

has escrito "backgorund" en vez de "background"

No creo que sea este el problema, pero probá con background-image, por las dudas.


Saludos.

[demiurgo_daemon]

hola,

además de lo que dice alvlin, puedes intentar definir también el ancho:

Código:

#header{
background-image: url(imagen.png);
height:120px;
width: 300px; /*un ejemplo*/
}

[ezra.wong]

gracias chicos por sus aportaciones, y ok ok ok perdon por el error de typeo era solo la logica de mi problematica.

con respecto a declarar los atributos por separado no funciona, o sea, hace lo mismito, tambien he declarado el ancho de manera relativa 100% y absoluta 320px; pero no da resultado, incluso cambie de .png a. gif pero esa tampoco es la solucion.

se que es dificil ayudar a la gente cuando esta no sube el codigo, asi que me tome la libertad de subirlo para ver si encuentran la falla por mi:

* firefox no se ve.
* IE7 si se ve.

-------------------------------------
html:

Código HTML:

<div id="header"></div> 

css:

Código HTML:

#header{
background:url(../images/template v5/header.png) center top no-repeat;
margin:auto;
padding:0px;
width:100%; height:175px;

les agradecere su ayuda, ya que tengo la pagina terminada y solo se ve en IE7

[PatomaS]

Hola

Asumiendo que la imagen existe y que está en la carpeta correcta, pasamos al código.

Si pones esto:

Código:

backgorund: url(imagen.png);

Te estás refiriendo a una imagen ubicada en la misma carpeta que la css, seguramente no es eso lo que quieres, así que debes tener cuidado con las rutas.

Si pones esto:

Código:

background:url(../images/template v5/header.png) center top no-repeat;

Estás llamando a la imagen "template", ubicada en la carpeta "images", la cual es paralela en jerarquía a donde estén las css.

Cuando tienes caracteres como espacios, paréntesis, puntos, etc en la uri del recurso, debes usar comillas, con lo que la llamada quedaría así:

Código:

background:url("../images/template v5/header.png") center top no-repeat;

Con esto, ya debería aparecerte la imagen siempre que exista y esté bien referenciada.

Finalmente, es aconsejable por motivos de validez y corrección del código que uses las capas vacías de esta forma:

Código:

<div id="header">&nbsp;</div>
ó
<div id="header"><p>&nbsp;</p></div>

Felicidad

[ezra.wong]

gracias PatomaS por tomarte el tiempo de contestar y ... si, asi es, agregando las comillas aparece la bella imagen tan anhelada por mi en el firefox.

gracias a todos por su tiempo y aportaciones