Os pongo una imagen de que es lo que quiero, y luego el código que tengo hecho...
El nº1, 2, 5 y 7 son común en todás las páginas que pondré.
El nº3 y 4 son un menu vertical y el contenido que tienen una altura variable.
Lo que quiero y es donde está mi lio, es en el nº5 y 6, quiero que estén pegados al nº7 (pie de pagina).
El nº5 (piemenu) es común a todos y es una imagen.
El nº6 (piecontenido) es una imagen que varia segun la pagina en la que estemos.
Yo consigo que una de las dos este pegada abajo que es la nº6, pero la del menu no se queda pegada abajo, pues el menú solo tiene 4 lineas y no llega abajo del todo.
Código:
body {
font-family:"futura Bk BT", Verdana, Arial;
text-align:justify;
font-size: 110%;
font-weight:bolder;
letter-spacing: 3px;
background: url(images/fondo.jpg) repeat-x top #93b2cd;
color: #FFF;}
#contenedor{
background:#FFF;
width:950px;
margin: auto;
margin-top: -11px;
text-align:left;
border: 3px #FFF solid;}
#cabecera {
background: url(images/header.png);
width:950px;
height:165px;}
#menuh {
font-size: 14px;
font-weight: 550;
letter-spacing:normal;
background: #92b1cd;
width:755px;
height:30px;
float: right;
text-align: center;
padding-right: 15px;
background: url(images/menubar.jpg) no-repeat;}
#cabecera h1 {
float: right;
font-size: 2.8em;
padding-right: 10px;
font-variant:small-caps;
color: #C91F16;}
#piemenu {width: 180px;
float: left;
height: 375px;
background: #fbf5dd;
position: absolute;
bottom: 0px;}
#piecontenido {width: 770px;
float: right;
height: 190px;}
#pie {
background: url(images/pie.jpg) bottom;
width:950px;
height:27px;
clear: both;
text-align: center;
padding-top: 10px;
border-top: 2px solid #FFF;
font-weight: bold;
font-size: 16px;
letter-spacing: normal;}
#pie * {
color: #666;
text-decoration: none;}
#contenido {
float:right;
width:758px;
height:auto;
min-height: 400px;
padding: 5px;
margin-top: -2px;
background: #f4f4f4;}
#vertmenu {
font-size: 16px;
font-weight:normal;
letter-spacing:normal;
width: 180px;
height:auto;
float: left;
background: #fbf5dd}
#vertmenu ul {
list-style: none;
margin: 0px;
padding: 0px;
border: none;}
#vertmenu ul li {
margin: 0px;
padding: 0px;
background: url(images/li1.jpg) no-repeat;}
#vertmenu ul li a {
display: block;
padding: 5px;
padding-left: 40px;
text-decoration: none;
color: #92b1cd;
margin-right: 10px;}
#vertmenu ul li a:hover, #vertmenu ul li a:focus {
color: #485866;
background: url(images/li2.jpg) no-repeat;}
h2 {background:url(images/H1.png) no-repeat;
padding-left: 70px;
color: #FFF;}
a {color: #FFF;
text-decoration: none;}
a:hover {color:#666;
text-decoration: none;}
p {color:#888;
padding-left: 20px;}
img.abajo {padding-top: 100px;}
Código:
Creo que me he explicado bastante mal pero espero que con los dibujos lo hayais pillao un poquillo mejor y me podais ayudar<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Titulo</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<link href="estilo.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="contenedor">
<div id="cabecera">
</div>
<div id="menuh">
<a href="portada.html">Portada</a> | <a href="nosotros.html">Nosotros</a> | <a href="informatica.html">Informática</a> | <a href="fotografia.html">Fotografía</a> | <a href="diseño.html">Diseño</a> | <a href="impresion.html">Impresión</a> | <a href="stands.html">Stands</a> |<a href="contacto.html"> Contacto</a>
</div>
<div id="vertmenu">
<ul class="menu">
<li></li>
</ul>
</div>
<div id="contenido">
<h2>Nosotros</h2>
<p>....</p>
</div>
<div id="piemenu">
<img src="images/menuv.jpg" alt="pie menu" /> </div>
<div id="piecontenido">
<img src="images/pie_nos.jpg" alt="pie" />
</div>
<div id="pie">
Optimizada para 1024x768. Derechos Reservados 2011</div>
</div>
</body>
</html>
Edito: el pie del menu vertical, la imagen (nº5) no la puedo meter dentro del menú porque entonces se me queda muy arriba, justo cuando acaba el contenido del menú vertical, y yo quiero que este pegada abajo.
Edito2: He puesto el tema aqui porque creo que es error en mi css, y no sabia si ponerlo aqui o en div
