¿Por quá la imagen no queda donde yo quiero?

adamsst · #1 (**permalink**) 17/07/2013, 16:04

hola a todos estoy practicando un poco de html y css y bueno decidi colocar una imagen que consegui en internet y dicha imagen queda muy por debajo del sitio donde yo deseo que quede esta misma

[align=center]aca les dejo una imagen para que vean mi problema[/align]

aca les dejo el codigo html

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=utf-8" />
<title>Documento sin título</title>
<link href="estilo.css" rel="stylesheet" type="text/css" />

</head>

<body>




<div id="header">


<table width="100%" height="109px">
  <tr>
    <td><img src="images/Sin título-1.jpg" width="87" height="108" /></td>       
    <td class="central"><p>Tratamientos Cosmeticos Faciales y Corporales</p></td>
    <td><img src="images/Sin título-2.jpg" width="135" height="108" align="right" /></td>
  </tr>
</table>

</div>


<div id="contenedordebotones"><table align="center" width="58%">
  <tr>
    
    <td class="boton1"><a>Inicio</a></td>
    <td class="boton2"><a>Tratamientos Corporales</a></td>
    <td class="boton3"><a>Tratamientos Faciales</a></td>
    <td class="boton4"><a>Contacto</a></td>
    
  </tr>
</table>


</div>


<div id="cuerpo">

    
<img src="images/imagen_inicio.png" width="1440" height="762" />




</div>



</body>
</html>

y aca el codigo css

Código:



#header{
	
	height: 109px;
	
}


.central{
	font-family: "Monotype Corsiva";
	font-size: 30px;
	background-color: #996600;
	height: 109px;
	text-align: center;	
	border-width: 1px; border-style: solid; border-color: black;
	
	
	}






#contenedordebotones{margin-top: 8px;
	font-family: "Monotype Corsiva";
	width: 100%;
	line-height: 120%;
	text-align: center;
	font-size: 20px;
	font-style: normal;
	color: #000;
	background-color: #C03;	
	border-width: 1px; border-style: solid; border-color: black;}


.boton1 a { text-decoration: none; border-radius: 10px; padding: 0px 5px 0px 5px; }
a:hover { background: #FFF; }

	 


.boton2  a { text-decoration: none; border-radius: 10px; padding: 0px 5px 0px 5px; }
a:hover { background: #FFF; }



.boton3  a { text-decoration: none; border-radius: 10px; padding: 0px 5px 0px 5px; }
a:hover { background: #FFF; }




.boton4  a { text-decoration: none; border-radius: 10px; padding: 0px 5px 0px 5px; }
a:hover { background: #FFF; }








#cuerpo {
	
	
	
}

gracias a quien me pueda ayudar

pzin · #2 (**permalink**) 17/07/2013, 17:04

Pues por el código en principio está bien, no debería de ocurrir. ¿No será que la parte blanca esa forma parte de la imagen?

Luego, hacer la maquetación de una página usando tablas es algo que no se recomienda para nada.

adamsst · #3 (**permalink**) 17/07/2013, 17:58

Cita:

Iniciado por pzin

Pues por el código en principio está bien, no debería de ocurrir. ¿No será que la parte blanca esa forma parte de la imagen?

Luego, hacer la maquetación de una página usando tablas es algo que no se recomienda para nada.

no amigo la franja blanca no es parte de la imagen porque la imagen yo la recorte en fireworks

aca te dejo un link para que veas online

http://pruebamia.comule.com/

pzin · #4 (**permalink**) 17/07/2013, 18:10

Pues vuelve a recortarla, porque es parte de la imagen: http://pruebamia.comule.com/images/imagen_inicio.png

Mariano_Floyd · #5 (**permalink**) 19/07/2013, 11:09

Como te comento pzin, no uses tablas para maquetar una web, no están destinadas para ello. Es solo una recomendación. Saludos