hola a todo, he leido en un manual que no esta bien el hacer una web con frames porque luego a la hora de posicionalo es una movida.
Tengo entendido (corregirme si me equivoco) que para hacerlo sin frames usamos DIV!!!
entonces ahora tengo una duda.... acabo de empezar una web...
aqui os facilito el codigo.
index.php
<!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" xml:lang="sp" lang="sp">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="css/default.css" rel="stylesheet" type="text/css" />
<title>TONI MAS</title>
</head>
<body id="general">
<div id="container">
<div id="topbar">parte superior
<div id="marquesina">Listado de Inmuebles de Antonio Mas Mañez</div>
</div>
<div id="main">hola main<div id="menu-izq">menu izquierda</div>
<div class="spacer"></div>
</div>
<div id="footer">Página desarrollada por Rubén Ferrer Ortiz</div>
</div>
</body>
</html>
default.css
/* ------------------------------
Estructura de la página
------------------------------ */
#general{
margin:0;
margin-left:122px;
margin-right:122px;
/*width:auto;*/
background-color:#ffe0ab;
}
/*
#container tiene un ancho absoluto de 780 pixeles.
El ancho de los elementos internos estan establecidos a auto,
por lo que todos tendrán el ancho del elemento contenedor.
*/
#container{
/*width:auto;*/
/*background-color:#ffe0ab; */
width:780px;
height:497px;
background-color:#ff0000;
border:0px;
display:block;
/*
border-top:0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
*/
}
p{
font:11px Verdana;
text-align:justify;
}
/***************Header**********************/
#topbar{
display:block;
height:auto;
width:780px;
font-size:1; /*for eliminate space between images*/
/*border-top:2px solid;
border-right: 2px solid;
border-bottom: 2px solid;
border-left: 2px solid;
border-top-color: #CCCCCC;
border-right-color: #CCCCCC;
border-bottom-color: #CCCCCC;
border-left-color: #CCCCCC;*/
}
#marquesina{
display:block;
text-align:center;
width:780px;
height:24px;
background-color:#fe8f00;
font:arial;
font-weight:bold;
}
#main{
display:block;
text-align:center;
background-color:#00ff11;
width:780px;
height:498px;
}
/****Barra de navegación*****/
#menu-izq{
display:block;
background-color:#f9be78;
width:208px;
height:200px;
}
#menu-izq ul, #menu-izq ul li{padding:0; margin:0; list-style:none; float:left;}
#menu-izq a{color:#FFFFFF; font-weight:bold;}
#menu-izq a:hover{color:red;}
#menu-izq li a:link, #menu-izq li a:visited {background:#444444; text-decoration:none; height:24px; line-height:24px; display:inline; float:left; width:auto; padding:0px 10px;}
/***************Contenido principal************/
/*
div.spacer, soluciona el alto de #main en diseños con 2 columnas*/
div.spacer{clear:both; height:10px; display:block;}
/***************footer*********************/
#footer{
display:block;
height:40px;
width: 780px;
border-top:1px solid;
text-align:center;
background-color:#fe8f00;
}
/*
p.contacto{font-family:Arial; font-size:18px; font-style:negrita}
*/
Os invito a copiar el codigo y probarlo...
no queda mal, es una idea.... pero si os fijais en el main, tienes anidado el menu-izq pero no se queda a la misma altura de hecho en main si quitas el texto si que se igualan pero lo que quiero es que queden a la misma altura aunque escriba algo... para hacer esto que tendria que hacer??
hacer que el main no ocupe el espacio de menu-izq??
es decir pornerl pegado a la derecha y recortarle el width??
si os fijais los margenes que se quedan en los lados de 122px es algo que se ven un muchas web, yo lo he hecho asi, no se si habra alguna forma mejor. Si la sabeis compartirla gracias...
Acepto cualquier comentario de como hacer esto de manera mas eficaz y solventar posibles errores futuros.
gracias