En realidad quiero colocar cuatro elementos, pero para simplificarlo pregunto por la forma de colocar 3 y después ya veré como colocar el 4º, como una imagen vale mas que 1000 palabras ahí va lo que quiero hacer:
Ahora mismo tengo el html de la siguiente forma:
Código HTML:
<body>
<div id="contenedor">
<div id="empuje"></div>
</div>
<div id="pie">
<span id="logo">
<img src="img/logo.gif" title="Logo alt="Logo" /></span>
<span id="direccion">
TEXTO<br />
TEXTO<br />
TEXTO</span>
<span id="nombres">
TEXTO<br />
TEXTO<br />
TEXTO<br />
</span>
</div>
</body>
Y el css
Código:
*{margin:0;}
html, body {
height:100%;
text-align:right;
}
#contenedor{
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -220px;
}
#pie, #empuje{
height:220px;
}
#pie{
margin-right:50px;
}
#logo{
float:right;
}
#nombres{
float:right;
margin-right:-330px;
}
#direccion{
float:right;
margin-top:140px;
}
Con este código consigo lo que necesito en Firefox pero no en Internet explorer 6 ni 7.
¿Alguna sugerencia? Seguramente haya una forma más sencilla de plantear la solución al problema.
Por cierto el código para poner el pie de página al pie lo he sacado de aquí
pie de pagina pegajoso.
Gracias ;)