capas paralelas en css
4 seguidores
Estoy intentando maquetar en css algo y no consigo poner dos capas a la misma altura.
La estructura es esta http://www.aireretro.com/css/
No os metais con el diseño pq es solo una estructura.
El menu de la izquierda ya lo tengo hecho, pero cuando meto otra capa para la derecha se me pone más abajo
Ayuda plizzzzz!
black
Violeta
La estructura es esta http://www.aireretro.com/css/
y esto es lo que quieres pasar a CSS, no? porque no pones un poco de código?
en teoría con un para de divs grandotes alineados a la misma altura vale...
Show me your Code!!!! :)
violeta
/* CSS Document */
/*elementos basicos*/
body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10;
font-weight:normal;
text-decoration:none;
color:#15659A;
text-align:justify;
}
p {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10;
font-weight:normal;
text-decoration:none;
color:#91115F;
}
h3 {
font:italec normal 12 pt verdana;
letter-spacing:1px;
color:#7d775c;
margin-bottom:opx;
}
.textonormal {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10;
font-weight:normal;
text-decoration:none;
color:#15659A;
text-align:justify;
}
.textonormalbold {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10;
font-weight:bold;
text-decoration:none;
color:#15659A; }
.textonormalboldgranate {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10;
font-weight:bold;
text-decoration:none;
color:#91115F; }
a:link {
font-family:verdana;
font-size:10;
font-weight:bold;
text-decoration:none;
color:#15659A;
}
a:visited {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10;
font-weight:bold;
text-decoration:none;
color:#15659A;
}
a:hover,a:active {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10;
font-weight:bold;
text-decoration:none;
color:#91115F;
}
a.submenus {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10;
font-weight:normal;
text-decoration:none;
color:#15659A;
}
a.submenus:link {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10;
font-weight:normal;
text-decoration:none;
color:#15659A;
}
a.submenus:hover {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10;
font-weight:normal;
text-decoration:none;
color:#91115F;
}
a.submenus:visited {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10;
font-weight:normal;
text-decoration:none;
color:#15659A;
}
a.submenus:active {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10;
font-weight:normal;
text-decoration:none;
color:#91115F;
}
p {
font-family:verdana;
font-size:10;
font-weight:normal;
text-decoration:none;
color:#333333;
background:#f7f7f7;
margin:opx;
}
/* capas especificas */
#contenedor {
position:relative;
left:20px;
top:0px;
width:720px;
height:100%;
background-image: url(pics/bg.jpg);
}
#interior {
position:relative;
left:30px;
top:0px;
width:660px;
height: 100%;
}
#menuizquierda {
left:0px;
top:0px;
width:180px;
}
#menuizquierdatexto {
left:10px;
top:0px;
width:170px;
}
#derecha {
position:relative;
left:185px;
top:0px;
width:470px;
}
Seguramente este la mitad mal, pero es mi primera prueba asi que tened piedad!
violeta
Esto es lo que tengpo maquetado
http://www.aireretro.com/css/indexcss.htm
violeta
Tampoco se si puedo alinear la capa al centro?
Usuario desconocido
buenas,
para alinear la capa en el centro pon en el #contenedor:
margin-left: auto;
margin-right: auto;
las capas específicas ponlas con posicion:absolute
yo también estoy empezando con esto de las hojas de estilo, supongo que alguno de los gurús que hay por aquí podrá ayudarte algo más
un saludo
violeta
pos gracias voy a probar y suerte!
helenp
Violeta, el margin auto no te va funcionar porque tienes esto:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
para que te funcione margin auto, y no tengas quirck mode tienes que tenerlo con dtd, asi:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
Es que a mi me pasó eso.......
violeta
Pues no me funcionaba, le acabo de cambiar eso q me dices Helen y parece q me lo centra "parece", aunke no del todo...
Bueno el lunes lo mirare con más detenimiento y os seguire dando la vara, muchas gracias de verdad, es que esto me está costando un huevo...
meddle
lo del "parece" es porque el IE en realidad no lo centra bien. lo centra, pero no perfectamente. hay varias maneras de arreglarlo. hay hacks de css creo y hay un script muy bueno que lo hace todo solito:
http://www.stilleye.com/temp/marginfix.html
violeta
joer sabeis todos los truquillos colega!!!
que haria yo sin vosotros!!!!!
merci beaucoup