salud ramón;
ante todo y en primer lugar agradecerte profundamente la ayuda.
he seguido escrupulosamente las directrices que propones como solución, pero
me he encontrado con un problema que ya casi me es familiar. contrariamente
a lo que lógicamente debería suceder, al situar el pie absolutamente y con
un bottom de 0px, sucede que cuando el texto excede el alto de la pantalla,
éste se desborda, quedando el pie posicionado exactamente en el mismo lugar
que estaba cuando el texto no desbordaba(sin scroll de navegador)en lugar de
pegado a la parte inferior de la pantalla del navegador, como debería... tu
solución parece sencilla y eficiente, sin embargo me encuentro con este
problema.
a continuación te pego el código para que veas lo que te estoy contando.
reitero mi agradecimiento.
/* código
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>
<html>
<head>
<title>My Blog</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
html,body {
height:100%;
min-height:100%;
margin:0px;
padding:0px;
}
#container {
height:100%;
min-height:100%;
margin:0px auto;
padding:0px;
text-align:left;
width: 692px;
background-color:#E6E4E4;
}
h1 {
text-indent: -9999px;
width: 692px;
height: 90px;
background-color:#16776a;
margin: 0;
padding: 0;
}
#left {
width: 178px;
float: left;
}
#content {
width: 479px;
float: left;
padding: 15px 0 10px 20px;
height:100%;
}
#footer {
margin: 0px auto;
position:absolute;
bottom:0px;
background-color: #16776a;
border-top: 9px solid #F7F7F6;
width: 692px;
padding: 5px 0;
clear: both;
}
/* --- navigation --- */
#navcontainer {
width: 178px;
}
</style>
</head>
<body>
<!-- Begin Container -->
<div id="container">
<h1>My Blog</h1>
<!-- Begin LEFT -->
<div id="left">
<!-- Begin navigation -->
<div id="navcontainer">
<ul>
<li><a href="#" id="current">Home</a></li>
<li><a href="#">About me</a></li>
<li><a href="#">Contact me</a></li>
<li><a href="#">Articles</a></li>
<li><a href="#">Photo roll</a></li>
</ul>
</div>
<!-- End navigation -->
</div>
<!-- End LEFT -->
<!-- Begin Content on the RIGHT -->
<div id="content">
<h2>This is the title</h2>
<p class="text"><img src="images/image.jpg" alt="image of the dessert"
width="150" height="139" class="imageright" />Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Curabitur wisi mi, rutrum sit amet, viverra
vel, sodales vitae,
magna. Donec tempus felis sit amet eros. Nam urna. Duis vel orci. Mauris
placerat elit id mauris. Nullam sagittis tincidunt dolor. Nunc odio
magna, porta eu, ullamcorper ac, volutpat eget, nunc. Quisque tempus leo at
augue. Etiam feugiat massa in sem. Quisque nec diam. Nunc tempus
wisi nec risus. Class aptent taciti sociosqu ad litora torquent per conubia
nostra, per inceptos hymenaeos. In auctor. Donec imperdiet ante
in metus. Curabitur felis nisl, placerat non, mollis eget, ullamcorper sit
amet, metus. In hac habitasse platea dictumst. Nam interdum urna ut
sapien. Nulla facilisi. Mauris ut velit. Proin non arcu.</p>
<p class="text">Aenean vel dui. Ut sit amet augue sed erat convallis
ullamcorper. Nam feugiat dictum lectus. Mauris magna arcu, aliquam et,
tempus eget, auctor
id, libero. Ut facilisis tortor eget turpis. Praesent ligula elit, suscipit
a, malesuada ac, porttitor eget, sapien. Vestibulum ante ipsum
primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vivamus
pede. Vivamus malesuada viverra nunc. Sed fringilla commodo odio.
Quisque luctus diam at odio. Nulla commodo. Donec mollis massa.</p>
<p class="text"> Nullam vitae lorem et leo euismod convallis. Nunc auctor
elementum lacus. Ut sagittis felis. Donec non wisi. In erat. Proin ornare
enim sed
nulla. Curabitur sagittis congue arcu. Aliquam auctor placerat turpis.
Suspendisse semper. Curabitur erat urna, eleifend at, varius eu,
molestie volutpat, purus. Proin consectetuer.</p>
<p class="text"><img src="images/image.jpg" alt="image of the dessert"
width="150" height="139" class="imageright" />Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Curabitur wisi mi, rutrum sit amet, viverra
vel, sodales vitae,
magna. Donec tempus felis sit amet eros. Nam urna. Duis vel orci. Mauris
placerat elit id mauris. Nullam sagittis tincidunt dolor. Nunc odio
magna, porta eu, ullamcorper ac, volutpat eget, nunc. Quisque tempus leo at
augue. Etiam feugiat massa in sem. Quisque nec diam. Nunc tempus
wisi nec risus. Class aptent taciti sociosqu ad litora torquent per conubia
nostra, per inceptos hymenaeos. In auctor. Donec imperdiet ante
in metus. Curabitur felis nisl, placerat non, mollis eget, ullamcorper sit
amet, metus. In hac habitasse platea dictumst. Nam interdum urna ut
sapien. Nulla facilisi. Mauris ut velit. Proin non arcu.</p>
<p class="text">Aenean vel dui. Ut sit amet augue sed erat convallis
ullamcorper. Nam feugiat dictum lectus. Mauris magna arcu, aliquam et,
tempus eget, auctor
id, libero. Ut facilisis tortor eget turpis. Praesent ligula elit, suscipit
a, malesuada ac, porttitor eget, sapien. Vestibulum ante ipsum
primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vivamus
pede. Vivamus malesuada viverra nunc. Sed fringilla commodo odio.
Quisque luctus diam at odio. Nulla commodo. Donec mollis massa.</p>
<p class="text"> Nullam vitae lorem et leo euismod convallis. Nunc auctor
elementum lacus. Ut sagittis felis. Donec non wisi. In erat. Proin ornare
enim sed
nulla. Curabitur sagittis congue arcu. Aliquam auctor placerat turpis.
Suspendisse semper. Curabitur erat urna, eleifend at, varius eu,
molestie volutpat, purus. Proin consectetuer.</p>
<p class="text"><img src="images/image.jpg" alt="image of the dessert"
width="150" height="139" class="imageright" />Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Curabitur wisi mi, rutrum sit amet, viverra
vel, sodales vitae,
magna. Donec tempus felis sit amet eros. Nam urna. Duis vel orci. Mauris
placerat elit id mauris. Nullam sagittis tincidunt dolor. Nunc odio
magna, porta eu, ullamcorper ac, volutpat eget, nunc. Quisque tempus leo at
augue. Etiam feugiat massa in sem. Quisque nec diam. Nunc tempus
wisi nec risus. Class aptent taciti sociosqu ad litora torquent per conubia
nostra, per inceptos hymenaeos. In auctor. Donec imperdiet ante
in metus. Curabitur felis nisl, placerat non, mollis eget, ullamcorper sit
amet, metus. In hac habitasse platea dictumst. Nam interdum urna ut
sapien. Nulla facilisi. Mauris ut velit. Proin non arcu.</p>
<p class="text">Aenean vel dui. Ut sit amet augue sed erat convallis
ullamcorper. Nam feugiat dictum lectus. Mauris magna arcu, aliquam et,
tempus eget, auctor
id, libero. Ut facilisis tortor eget turpis. Praesent ligula elit, suscipit
a, malesuada ac, porttitor eget, sapien. Vestibulum ante ipsum
primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vivamus
pede. Vivamus malesuada viverra nunc. Sed fringilla commodo odio.
Quisque luctus diam at odio. Nulla commodo. Donec mollis massa.</p>
<p class="text"> Nullam vitae lorem et leo euismod convallis. Nunc auctor
elementum lacus. Ut sagittis felis. Donec non wisi. In erat. Proin ornare
enim sed
nulla. Curabitur sagittis congue arcu. Aliquam auctor placerat turpis.
Suspendisse semper. Curabitur erat urna, eleifend at, varius eu,
molestie volutpat, purus. Proin consectetuer.</p>
</div>
<!-- End Content on the RIGHT -->
<div class="clear"> </div>
<!-- Begin Footer -->
<div id="footer">
<h2>copyright © 2004 Veerle Pieters - <a href="http://www.duoh.com";
target="_blank">Duoh!® n.v.</a></h2>
</div>
<!-- End Footer -->
</div>
<!-- End Container -->
</body>
</html>
*/
_______________________________________________
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a [email protected]
Puedes modificar tus datos o desuscribirte en la siguiente dirección:
http://ovillo.org/mailman/listinfo/ovillo
