Bajar la capa #bajo abajo del todo

[Borjimante]

Hola, estoy haciendo un diseño de mi web y tengo un problema, el problema esque con IE el bajo se baja como quiero mientras que con el MF n y no se por que, ayuda.

http://www.antera-solutions.com/Diseno-v5/

#bajo{
width: 700px;
margin:auto;
text-align: center;
background-color: #3366CC;
background-position: bottom;
display: block;
font-size: 0.7em;
font-family: Geneva, Arial, Helvetica, sans-serif;
font-weight: bold;
color: #FFFFFF;
}

Un saludo y ayuda

[Borjimante]

nadie sabe solucionarlo?

[innes]

quizás tienes que añadir algo como

margin-bottom: 0 px;

no soy nada experta pero por probar no pierdes nada...

[Borjimante]

nada, no funciona, alguien mas tiene alguna idea, esque nos soy capaz de encontrar el fallo

[innes]

Yo es que lo poquito que he trabajado hasta ahora no he utilizado nunca la propiedad display y rara vez he tenido problemas así que a lo mejor si no pones display:block puede que funcione sin problemas...

pero está claro que tiene que haber muchísima gente que domine el tema y puedan dar con la clave, lo que pasa es que son malas fechas

saludos!

[kaninox]

haber prueba

position: fixed;
center: 0;
bottom: 0;

[Borjimante]

se baja a la esquina inferior izquierda segun dices

[Borjimante]

alguna otra idea??

[sjam7]

pues a lo que dijo kaninox agregale margin:auto; a ver si jala

o intenta poniendo un <br clear="all"> antes del div de bajo

[Borjimante]

nada que nohay manera, necesitais mas codigo o algo?

[K3NNY]

No termino de entender el problema, pero si te referís a que con Fx queda un espacio de un par de pixeles entre el final de tu web y el final de la ventana, te sugeriría que pusieras este código CSS...

Código:

body, html {padding:0;margin:0}

...y nos cuentes como te fue.

[Borjimante]

No, me refiero a que la capa #bajo en MF no esta abajo sino que esta por encima de la otra tapando y no queda comoe n IE, entonces yo quiero bajarla para que no se sobreponga y quede como en IE, segun como dices no pasa nada.

[floren]

El link está roto, no podemos verlo.

[Borjimante]

si lo siento

El nuevo enlace es www.antera-solutions.com

[Yaraher]

Prueba jugando entonces con el atributo z-order para posicionar la capa detrás de la otra.

[floren]

Esa parte de abajo se vuelve un poco loca en FF, prueba a ponerle un clear:both, que deje aire y se coloque. Ponle un border: 1px solid; para ver dónde se está colocando ese contenedor.

position:relative en #left-bajo diría que sobra.

[Borjimante]

nada he provado eso y no pasa nada , os paso todo el codigo haber si es algun fallo.

#bajo{
width: 700px;
margin: auto;
text-align: center;
background-color: #3366CC;
font-size: 0.7em;
font-family: Geneva, Arial, Helvetica, sans-serif;
font-weight: bold;
clear: both;
color: #FFFFFF;
border: 1px solid
}

#left-bajo{
text-align: left;
float: left;
padding-top: 8px;
padding-bottom: 4px;
margin-left: 10px;
}

#right-bajo{
text-align: right;
padding-top: 8px;
padding-bottom: 4px;
float: right;
margin-right: 10px;
}

#right-bajo-b{
text-align: right;
float: right;
}

#left-bajo-b{
text-align: left;
float: left;
}

<div id="bajo">
<div id="left-bajo-b"><img src="img/bajo-izq.jpg" alt="" /></div>
<div id="left-bajo">2006-2007 &copy; <ul class="bajo-1-1-1"><li><a href="http://www.antera-solutions.com" class="enlace-bajo">Antera Solutions</a></li></ul>. All right reserved. </div>
<div id="right-bajo-b"><img src="img/bajo-der.jpg" alt="" /></div>
<div id="right-bajo">
<ul class="bajo-1-1-1">
<li><a href="http://validator.w3.org/check?uri=referer" class="enlace-bajo">XHTML</a> -</li>
<li><a href="http://jigsaw.w3.org/css-validator/check?uri=referer" class="enlace-bajo">CSS</a> -</li>
<li><a href="http://www.antera-solutions.com/accesibilidad/index.html" class="enlace-bajo">AAA</a></li>
</ul>
</div>
</div>

Un saludo

[floren]

No estoy seguro, creo que puedes solucionarlo dándole una altura a #bajo

#bajo{
width: 700px;
height: 50px; /*por ejemplo*/
margin: auto;
text-align: center;
background-color: #3366CC;
font-size: 0.7em;
font-family: Geneva, Arial, Helvetica, sans-serif;
font-weight: bold;
/*clear: both;*/
color: #FFFFFF;
/*border: 1px solid #000000;*/
}

Lo estoy probando en http://www.aaservers.org/antera/, por cierto ¡valida antes tu código!

[Borjimante]

de momento va bien floren ya solo falta bajar la capa bajo un poco mas

[floren]

Te sugería el border: 1px solid #000000; para que vieras dónde se ubica, ya que una cosa es lo que tienes en mente y otra puede ser cómo lo entiende el navegador.

Ve a lo simple y de entrada intenta ubicar en cada sitio cada una de las capas principales; si quieres que #bajo está más abajo puedes ir jugando con su propiedad margin-top; que la separa de lo que haya arriba.

Suerte!

[demiurgo_daemon]

Hola,

en realidad, no es que tu pie de página se esté haciendo hacia arriba, sino que tu cuerpo se desborda porque le definiste una altura fija:

Código:

#cuerpo {
	padding: 0px;
	width: 680px;
	height: 675px;
	text-align: center;
	float: left;
}

Como lo veo, tienes dos opciones generales:

1. Cambiar height por min-height: hace crecer la página a partir de un mínimo. Sin embargo, te puede traer problemas en Explorer inferior a 7 (personalmente, que se pudra; si Micro$oft va a descontinuar soporte para eso, yo también).

2. agregar overflow para manipular el texto que se desborda. Puedes usar estos valores:

• hidden: esconde el texto que se desborda
• scroll: pone barras de desplazamiento para ver el resto
• auto: maneja automáticamente el poner o no las barras
• show: muestra lo desbordado (lo que te está sucediendo)

Personalmente, me iría por min-height, pero evalúa tus opciones.

Saludos

[Borjimante]

uff , por fin muchas gracias a todos al final era por la maldita altura del cuerpo, muchas gracias de nuevo y muy completa la respuesta demiurgo_daemon

Un saludo