Foros del Web - Ver Mensaje Individual

podmaster · #8 (**permalink**) 17/02/2011, 15:46

perdon pero no lo logro comprender , es que como ya dije no hace mucho que empece y me pierdon con los ejemplos muy largos . para explicarme mejor , cree un html y una hoja de estilo que es basicamente mi problema.

les dejo tambien las imagenes que uso como sombra paralela.

descarguenlas aqui:(tienen 1px de alto asi que si no la pueden ver no se preocupen)

http://s582.photobucket.com/albums/ss266/podmasterfoto/?action=view&current=der.png

http://s582.photobucket.com/albums/ss266/podmasterfoto/?action=view&current=izq.png

HTML:

Código HTML:

<html>
 <head>
	
	<title>Ejemplo sombra paralela</title>
	<LINK rel="stylesheet" href="estilo01.css" type="text/css" media="all">
 </head>
<body>
<div id="contenedor">
<div id="sombra-derecha"></div>
<div id="cuerpo">a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br>a<br></div>
<div id="sombra-izquierda"></div>


</div>

</body>
</html>

La hoja de estilo.

Código HTML:

body {background-color:#1232aa;
	height:100%;}

#contenedor{width:1000px;
	margin:0px auto 0px auto;
	height:100%;}

#cuerpo {background-color:#FFFFFF;
	width:600px;
	height:100%;;
	float:right;}



#sombra-izquierda
{background-color:transparent;
background-image:url('izq.png');
background-repeat:repeat-y;
background-position:right;
width:170px;
	height:100%;;
	float:right;}



#sombra-derecha
{background-color:transparent;
background-image:url('der.png');
background-repeat:repeat-y;
background-position:left;
width:170px;
	height:100%;;
	float:right;}

hagan la prueba creen un html copien el codigo y la hoja de estilo nombrenla estilo01.css coloquen las 2 imagenes y fijense.