no puedo poner imagen en div

barredera · #1 (**permalink**) 01/02/2013, 05:53

Buenos dias, estoy intentando poner una imagen dentro de un div pero no hay manera, me e leido las faqs e probado varias formas pero no me aparece la imagen alguien me puede ayudar pongo aqui el codigo

Código:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
		<link rel="stylesheet" href="css/estilos.css" type="text/css"/>
		
		<style type="text/css">
<!--
body {
	background-color: #000000;
}
-->
</style></head>

<body>

<div id="contenedor">
 
<div id="logo"></div>

<div id="menu"></div>

<div id="slider"></div>

<div id="contenido"></div>

<div id="final"></div>

</div>

</body>
</html>

Y este el css

Código:

#contenedor{
width:678px;
   margin-left:auto; 
   margin-right:auto;
   margin-top:10px;
background:#0000FF;

}

#logo {

background-image:(/images/logo.gif);
height: 52px;
width: 250px;
background-repeat:no-repeat;
background-attachment: scroll;
   background-position: 10px 10px;
}

Imagino que debe ser alguna tonteria que paso por alto pero no hay manera.

Saludos.

pzin · #2 (**permalink**) 01/02/2013, 05:54

En todo caso estás intentando poner una imagen como fondo, no una imagen dentro de un div. Es diferente.

Te falta url. La sintaxis correcta viene siendo algo así:

Código CSS:

Ver originalbackground-image: url(/images/logo.gif);

Ahora, semánticamente, un logotipo forma parte del contenido y en principio habría que ponerlo como un elemento más del mismo con img.

madman_18 · #3 (**permalink**) 01/02/2013, 06:10

¿Puede ser el / del inicio de la ruta que le tienes puesto?

Podrías probar de las siguientes forma:

Código CSS:

Ver originalbackground: url('images/logo.gif') no-repeat top scroll;
height: 52px;
width: 250px;

No estoy muy seguro de si se tragará el position que le tienes puesto de 10px 10px...... en vez del 'top' que he puesto, prueba con lo de 10px 10px a ver si te funciona así y ya nos comentas :)

barredera · #4 (**permalink**) 01/02/2013, 09:33

Vamos esto es la ostia, os cuento lo que me a pasado, e probado vuestros dos códigos y tampoco me funcionaba y eso ya no podia ser, estoy haciendolo en dreamweaver y ya harto a la hora de elejir la imagen, en vez de ponerla a mano la ruta que es lo que estaba haciendo, e decidio ponerla desde el botoncito que tiene el dreamweaver para insertar imágenes y ahora ya funciona y el código es exactamente el mismo, como puede ser eso?

Por cierto muchísimas gracias a los dos por responder.

pzin · #5 (**permalink**) 01/02/2013, 10:01

Pues que la ruta que ponías de la imagen antes no era la que es.

madman_18 · #6 (**permalink**) 01/02/2013, 10:37

¿Podrías poner el código que te da ahora dreamweaver? Asi vemos donde estaba el fallo ;)

Cloudz · #7 (**permalink**) 02/02/2013, 18:02

A mi conclusion es que estabas llamando la imagen mal

background: url('/images/logo.gif') no-repeat top scroll;

debia ser

background: url('../images/logo.gif') no-repeat top scroll;

ya que de seguro la tenias en un nivel mas alto de la carpeta actual y te faltaban dos puntos ../, saludos :D

Danicnv · #8 (**permalink**) 05/02/2013, 13:45

Casi seguro el problema que tenias era el tema de las rutas relativas. Como bien a dicho Cloudz necesitabas ../ porque tu pagina web quizas no sea index sino que este en otra carpeta y tengas que salir de ella para entrar en images (para acceder a la imagen).
En el caso de que no sea eso, tambien veo yo otro problema; sola la barra, no funciona seria ./ un punto y la barra, o sin punto y sin barra. Existen esas dos opciones.

Supongo que el problema venia de hay.

madman_18 · #9 (**permalink**) 06/02/2013, 01:41

Lo más seguro es lo que apuntan por ahí Cloudz y Danicnv....puede ser que tu código tuviera que tener rutas como por ejemplo:

Código CSS:

Ver originalbackground: url('imagenes/logo.gif');
background: url('../imagenes/logo.gif');

En el primero estarías en la raíz del sitio, y te desplazarías a la carpeta imagenes, y en la segunda posibilidad estarías dentro de una carpeta, subirías un nivel (con el '../') y te meterías dentro de la carpeta imagenes.

Saludos!

alex_dh · #10 (**permalink**) 17/02/2013, 02:00

Código CSS:

Ver originalbackground-image: url(/images/logo.gif);

fijate bien la direccion que usas tambien