Foros del Web » Creando para Internet » CSS »

Problema con imagen background...

Estas en el tema de Problema con imagen background... en el foro de CSS en Foros del Web. Hola a todos, Escribo porque tengo un problemilla, estoy remodelando una web que hice y estoy haciendo un box y quiero poner una imagen de ...
  #1 (permalink)  
Antiguo 14/04/2009, 02:02
 
Fecha de Ingreso: octubre-2008
Mensajes: 19
Antigüedad: 9 años, 1 mes
Puntos: 0
Problema con imagen background...

Hola a todos,

Escribo porque tengo un problemilla, estoy remodelando una web que hice y estoy haciendo un box y quiero poner una imagen de fondo (tal como estaba antes) y no se porque no se me visualiza. os pongo de referencia las dos webs y el codigo fuente de la nueva.


Página antigua (los boxes con el background los quiero conservar):
monvigar.com/recursos.html

Página nueva (no puedo poner la imagen de background):
monvigar.freehostia.com/recursos.html


Codigo fuente html:

<div id="caja">Soldadores homologados (5)<br />
Personal Taller (25)<br />
Personal administraci&oacute;n (5)<br />
Ingenieros industriales (1)<br />
Ingenieros t&eacute;cnicos (1)<br />
Delineantes (2)<br />
<br />
</div>


en el codigo css no se que poner porqué he probado varias cosas y además del problema de la imagen background ahora no se porqué si hago la etiqueta "caja" con un width menor a 750 se me estrecha toda la página.


Soy bastante novato así que puede ser que sea alguna tonteria,

Saludos a todos, espero vuestras respuestas!
  #2 (permalink)  
Antiguo 14/04/2009, 02:48
 
Fecha de Ingreso: octubre-2008
Mensajes: 19
Antigüedad: 9 años, 1 mes
Puntos: 0
Respuesta: Problema con imagen background...

por fin, conseguido, no acabo de saber a ciencia cierta lo que era pero pongo los códigos por si a alguien le sirve

html:

<div id="caja"><br /><br />Soldadores homologados (5)<br /><br />
Personal Taller (25)<br /><br />
Personal administraci&oacute;n (5)<br /><br />
Ingenieros industriales (1)<br /><br />
Ingenieros t&eacute;cnicos (1)<br /><br />
Delineantes (2)<br />
<br />
</div>

css:

#caja {

padding-top:5px;
padding-bottom:5px;
padding-left:15px;
padding-right:15px;
text-decoration: none;
border-right: 1px solid #fff;
width: 300px;
height: 300px;
background-image: url(../img/box_recursos2.jpg);
background-repeat: no-repeat;
background-position: left top;
line-height: 15px;
}


Por cierto alguien sabe porque la imagen del header se ve en mozilla y no en internet explorer??? pongo el código a continuación (monvigar.freehostia.com) en dreamweaver nose porque no se ve la imagen en vista diseño:

html:

<div id="page_header">


<h1 align="center">&nbsp;</h1>
<div id="flags">
<ul>
<li><a href="xxx"><img src="img/flag_cat.gif" alt="Español"/></a></li>
<li><a href="xxx"><img src="img/flag_spa.gif" alt="English"/></a></li>
</ul>
</div>
</div>


css:

#page_header {
height: 120px;
clear: both;
background-color: #FFFFFF;
background-image: url(../img/header.jpg);
background-repeat: no-repeat;
background-position: center center;
}

Saludos y gracias!!
  #3 (permalink)  
Antiguo 15/04/2009, 01:03
 
Fecha de Ingreso: julio-2008
Mensajes: 39
Antigüedad: 9 años, 4 meses
Puntos: 0
Respuesta: Problema con imagen background...

hola! mira, puedes ahorrarte unos bytes limpiando tu codigo!
podria quedar asi:

Código:
#caja {
padding:5px 15px;
border-right: 1px solid #fff;
width: 300px;
background: url(../img/box_recursos2.jpg) no-repeat left top;
}
#caja ul{
list-style:none;
margin:10px 0 10px;
}
#caja ul li{
margin-bottom:8px;
}
y tu html seria mas limpio de esta manera:

<div id="caja">
<ul>
<li>Soldadores homologados (5)</li>
<li>Personal Taller (25)<br /></li>
<li>Personal administraci&oacute;n (5)</li>
<li>Ingenieros industriales (1)</li>
<li>Ingenieros t&eacute;cnicos (1)</li>
<li>Delineantes (2)</li>
</ul>
</div>

ahora con lo del header:
1. Deberias quitar el h1 que no tiene nada (puntos menos en accesibilidad)
2. agregale un clear:both; despues de tu div flags
3. darle un height especifico porque lo que tienes no va a "crecer"

Exitos!
  #4 (permalink)  
Antiguo 15/04/2009, 04:39
 
Fecha de Ingreso: octubre-2008
Mensajes: 19
Antigüedad: 9 años, 1 mes
Puntos: 0
Re: Problema con imagen background...

Hola jepserk8, gracias por tu respuesta, pero sigo con el problema del header he hecho lo que me has dicho, pero no hay manera, ahora no se ve ni en uno ni en otro (debe ser alguna cosa que se me ha pasado, pero no se el que), la imagen ahora me hace 750x120, lo mismo que el box del div.

La web es esta:
monvigar.com

El código es este:

HTML:

<div id="page_header">
<div id="flags">
<ul>
<li><a href="index_cat.html"><img src="img/flag_cat.gif" alt="Español"/></a></li>
<li><a href="index.html"><img src="img/flag_spa.gif" alt="English"/></a></li>
</ul>
</div>
</div>

CSS:

#page_header {
height: 120px;
width: 750px;
background-image: url(img/header.jpg);
background-repeat: no-repeat;
background-position: center center;

}

#flags {
width:90px;
height:0px;
float: right;
top: 80px;
right: 690px;
position:relative;
clear:both;
}
#ul{
float:left;
}
#ulli {
float:left;
list-style-type: none;
}
#ul li a {
text-decoration:underline;
}

#flags ul li {
display: inline;
}

Espero vuestras respuestas, que esto casi está!!!
Saludos!!
  #5 (permalink)  
Antiguo 16/04/2009, 01:14
 
Fecha de Ingreso: octubre-2008
Mensajes: 19
Antigüedad: 9 años, 1 mes
Puntos: 0
Respuesta: Problema con imagen background...

Hola a todos!

Nadie sabe a que puede ser debido que no se vea la imagen background del header?
A alguien se le ocurre alguna solución alternativa??

Saludos y gracias!!!
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 21:11.