Hola!
Tengo un problema a hora de insertar 2 imagenes en el lateral de una pagina que estoy haciendo.
La foto de la pagina (digo foto porque la pagina en si no existe, se parte de una foto y a partir de ella hay que hacerla) que quiero hacer esta en:
http://www.gratisweb.com/bladu/pagin...gina%20CSS.bmp
En esta foto vereis que hay 2 imagenes, las del consorcio w3c, esas imagenes son imagenes clicables y hay que insertarlas en la pagina.
Con las imagenes lo que hice fue capturar la pantalla y editarlas con el paint.
Las fotos de las imagnes estan en :
http://www.gratisweb.com/bladu/pagin.../W3C%20CSS.JPG http://www.gratisweb.com/bladu/pagin...20XHTML1.0.JPG
Esas imagenes son las que me dan problemas ya que cuando las inserto habiendo cogido las coordenadas de cada una de ellas, me coge la imagen y lo blanco y se descuadra el lateral.
Ahi esta el problema, yo solo quiero las imagenes y me coge todo (la imagen y el margen blanco).
Aqui os pongo el codigo que estoy haciendo de la pagina:
Código HTML:
<html>
<head>
<title>MI SITIO WEB</title>
<link rel="STYLESHEET" type="text/css" href="estilos/estilo.css" />
<style type="text/css" ></style> </head>
<body>
<div id="contenedor">
<div id="cabecera">
<h1> Mi sitio web </h1>
</div> <!-- fin de la cabecera-->
<div id="cuerpo">
<div id="lateralizqdo" >
<ul>
<li>Vínculo</li>
<li>Vínculo</li>
<li>Vínculo</li>
<li>Vínculo</li>
<li>Vínculo</li>
<li>Vínculo</li>
<li>Vínculo</li>
</ul>
</div>
<div id="lateraldcho" >
<p> Aquí se podría colocar una foto personal, una imagen, anuncios, vínculos más visitados,etc...</p>
<table>
<tr>
<img src="IMG/W3C CSS.JPG" usemap="#FOTO"/>
<map name="FOTO">
<area shape="rect" coords="3,7,85,36" href="http://jigsaw.w3.org/css-validator/" alt="pagina de W3c css"/>
</map>
</tr>
<img src="IMG/W3C XHTML1.0.JPG" usemap="#FOTO2"/>
<map name="FOTO2">
<area shape="rect" coords="3,0,94,34" href="http://validator.w3.org/check?uri=referer" alt="pagina W3c xhtml 1.0"/>
</map>
</table>
</div>
<div id="central">
<h1> Título del contenido</h1>
<h2> Subapartado </h2>
<p>Escribe algo para rellenar</p>
<p>Escribe algo para rellenar</p>
<h2> 2ª Subapartado</h2>
<h3>Otra sección más pequeña </h3>
<p>Escribe algo para rellenar</p>
<p>Escribe algo para rellenar</p>
<h3>y otra...</h3>
<p>Escribe algo para rellenar</p>
<p>Escribe algo para rellenar</p>
<p>Escribe algo para rellenar</p>
</div>
</div>
<div id="pie">
<h6> Mi sitio web 2006, todo el C_C reservado </h6>
</div>
</div>
</body>
</htm>
Y aqui os pongo el de los estilos:
Código:
BODY
{
background: white;
font-size: 12 pt;
font-family: Times New Roman;
color: black;
border-top-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-right-style: solid;
}
h1
{
font-size: 25 pt;
font-family: Times New Roman;
color: black;
text-align: left;
}
h2 {
font-size: 15 pt;
font-family: Times New Roman;
color: black;
text-align: left;
}
h3
{
font-size: 12 pt;
font-family: Times New Roman;
color: black;
text-align: left;
}
h6 {
font-size: 10 pt;
font-family: Times New Roman;
color: black;
}
#cabecera
{
padding: 0px 200px 100px 0px;
border-bottom-style: solid;
}
#lateralizqdo
{
width: 25%;
float: left;
border-top-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-right-style: solid;
border-top-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-right-width: 1px;
margin-top: 10px;
margin-bottom: 10px;
margin-left: 5px;
margin-right: 10px;
}
#lateraldcho
{
width: 25%;
float: right;
border-top-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-right-style: solid;
border-top-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-right-width: 1px;
margin-top: 10px;
margin-bottom: 10px;
margin-left: 5px;
margin-right: 10px;
}
#central
{
width: 60%;
margin-left: 30%;
margin-right: 50%;
}
#pie {
border-top-style: none;
border-bottom-style: none;
border-left-style: none;
border-right-style: none;
border-top-width: 1px;
border-bottom-width: 1px;
border-left-width: 1px;
border-right-width: 1px;
margin-top: 4px;
margin-bottom: 4px;
margin-left: 4px;
margin-right: 4px;
font-size: 10pt;
text-align: center;
}
Os agradeceria mucho que me ayudarais a resolver este "pequeño problemilla".
Gracias
Un saludo.