Foros del Web » Creando para Internet » CSS »

Ayuda!! Problema a hora de insertar imagenes en un lateral

Estas en el tema de Ayuda!! Problema a hora de insertar imagenes en un lateral en el foro de CSS en Foros del Web. 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 ...
  #1 (permalink)  
Antiguo 22/01/2008, 07:59
 
Fecha de Ingreso: mayo-2007
Mensajes: 222
Antigüedad: 10 años, 6 meses
Puntos: 0
Ayuda!! Problema a hora de insertar imagenes en un lateral

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.
  #2 (permalink)  
Antiguo 22/01/2008, 09:09
Avatar de jacin  
Fecha de Ingreso: enero-2007
Ubicación: Alicante
Mensajes: 62
Antigüedad: 10 años, 10 meses
Puntos: 2
Re: Ayuda!! Problema a hora de insertar imagenes en un lateral

Por que no las insertas dentro de un enlace???

Código HTML:
<a href="http://jigsaw.w3.org/css-validator/">
   <img src="IMG/W3C CSS.JPG" alt="pagina de W3c css" />
</a> 
  #3 (permalink)  
Antiguo 22/01/2008, 09:38
 
Fecha de Ingreso: mayo-2007
Mensajes: 222
Antigüedad: 10 años, 6 meses
Puntos: 0
Re: Ayuda!! Problema a hora de insertar imagenes en un lateral

Cita:
Iniciado por jacin Ver Mensaje
Por que no las insertas dentro de un enlace???

Código HTML:
<a href="http://jigsaw.w3.org/css-validator/">
   <img src="IMG/W3C CSS.JPG" alt="pagina de W3c css" />
</a> 

Hola jacin!

Ante todo gracias por haberte tomado la molestia de constestar.

Respecto a poner la imagen dentro de un enlace, es una muy buena idea, no sabia que se podia hacer asi tambien.

Mi idea era hacerlo con imagenes clikables cogiendo las coordenadas que corresponden a los bordes de la imagen, para asi quitar lo blanco.

De todas formas he probado con lo tuyo y sigue saliendome como antes.

Te pongo el resultado: http://www.gratisweb.com/bladu/pagin.../imagenW3C.bmp

La raya vertical negra es el limite del derecho de la pagina y como podras observar al querer insertar la imagen me coge la imagen y el espacio en blanco.

Alguna idea mas?


Saludos.
  #4 (permalink)  
Antiguo 22/01/2008, 13:30
 
Fecha de Ingreso: mayo-2007
Mensajes: 222
Antigüedad: 10 años, 6 meses
Puntos: 0
Re: Ayuda!! Problema a hora de insertar imagenes en un lateral

Alguien que me pueda echar una mano, en como poner esa dichosa imagen bien?

S2!
  #5 (permalink)  
Antiguo 23/01/2008, 03:52
 
Fecha de Ingreso: mayo-2007
Mensajes: 222
Antigüedad: 10 años, 6 meses
Puntos: 0
Re: Ayuda!! Problema a hora de insertar imagenes en un lateral

lo subo, que para mi es importante y urgente.

S2!
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 01:38.