Foros del Web » Creando para Internet » CSS »

como poner un footer debajo de un div flotante

Estas en el tema de como poner un footer debajo de un div flotante en el foro de CSS en Foros del Web. hola a todos... soy nuevo en este foro y tengo la siguente duda: ando creando una web de videojuegos "community360.byethost10.com" y el problema esque tengo ...
  #1 (permalink)  
Antiguo 20/08/2009, 19:47
 
Fecha de Ingreso: agosto-2009
Mensajes: 292
Antigüedad: 8 años, 3 meses
Puntos: 5
como poner un footer debajo de un div flotante

hola a todos... soy nuevo en este foro y tengo la siguente duda:

ando creando una web de videojuegos "community360.byethost10.com" y el problema esque tengo creado un div flotante de lado izquierdo y lo que pasa esque cuando hay poco contenido el footer se queda abajo del menu izquierdo y lo que quiero es que el footer se ponga abajo del menu izquierdo no al lado.

hay el codigo php y css para ver si me pueden echar la mano

Código PHP:
<body>

<
div id="wrapper">

<
div id="menu-left">

<
div id="menu_left-inicio"></div>
<
ul class="navi-left"
<
li><a href="#">Noticias</a></li>
<
li><a href="#">Foros</a></li>
<
li><a href="#">Sala de Chat</a></li>
<
li><a href="sec/staff.php">Miembros del Equipo</a></li>
</
ul>

<
div id="menu_left-xbox360"></div>
<
ul class="navi-left"
<
li><a href="#">aaaaaaa</a></li>
<
li><a href="#">bbbbbbb</a></li>
<
li><a href="#">ccccccc</a></li>
</
ul>

<
div id="menu_left-generos"></div>
<
ul class="navi-left"
<
li><a href="#">Acción</a></li>
<
li><a href="#">Aventura</a></li>
<
li><a href="#">Compilaciones</a></li>
<
li><a href="#">Familia</a></li>
<
li><a href="#">Lucha</a></li>
<
li><a href="#">Música</a></li>
<
li><a href="#">Plataforma</a></li>
<
li><a href="#">Carreras</a></li>
<
li><a href="#">RPG</a></li>
<
li><a href="#">Shooter</a></li>
<
li><a href="#">Simulación</a></li>
<
li><a href="#">Deportes</a></li>
<
li><a href="#">Estrategia</a></li>
<
li><a href="#">Originales Xbox</a></li>
<
li><a href="#">Xbox LIVE Arcade</a></li>
</
ul>

<
div id="menu_left-multimedia"></div>
<
ul class="navi-left"
<
li><a href="#">aaaaaaa</a></li>
<
li><a href="#">bbbbbbb</a></li>
<
li><a href="#">ccccccc</a></li>
</
ul>

</
div><!--Menu left-->

<
div id="container">

<
div id="publicidad"></div><!--Fin publicidad-->

<
div id="menu-right"></div><!--Fin menu right-->

<
div id="content"></div><!--Fin content-->

</
div><!--Fin container-->

<
div id="footer">

<
div id="community-logo"></div>
<
div id="logo-footer"><a href="#" title="Comunidad online de Xbox 360"></a></div>

<
div id="copyright">
<
strong>Community360 &copy;.</strong>Prohivida la reprodicción total o parcial del contenido sin autorizaciónCommunity360.byethost10.comno es una web oficialsólo es un fansite.<br/>
Los nombres y logotipos de las compañías y productos aquí mencionados son marcas comerciales de sus respectivos propietarios. <br/>
</
div>
  
  
</
div>

</
div><!--Fin wrapper-->

</
body>
</
html
Código:
body {
	background-color:#535D66;
	background-image:url(images/bg_home.png);
	background-position:top center;
	background-repeat:no-repeat;
	font-family:Arial,Helvetica,sans-serif;
	font-size:12px;
	margin:0;
}

#wrapper {
	background-image:url(images/wrapper_bg.png);
	background-repeat:repeat-y;
	height:auto;
	margin-bottom:10px;
	margin-left:auto;
	margin-right:auto;
	margin-top:320px;
	overflow:hidden;
	width:1000px;
}

#container {
	background-image:url(images/container-bg.png);
	height:auto;
	overflow:hidden;
	padding-left:10px;
	padding-right:10px;
	width:820px;
}

#menu-left {
	background-color:#7AA827;
	float:left;
	font-size:12px;
	font-weight:bold;
	height:auto;
	width:160px;
}

#menu_left-inicio {
	background-image:url(images/menu_left-inicio.png);
	background-repeat:no-repeat;
	height:30px;
	width:160px;
}

#menu_left-xbox360 {
	background-image:url(images/menu_left-xbox360.png);
	background-repeat:no-repeat;
	height:30px;
	width:160px;
}

#menu_left-generos {
	background-image:url(images/menu_left-generos.png);
	background-repeat:no-repeat;
	height:30px;
	width:160px;
}

#menu_left-multimedia {
	background-image:url(images/menu_left-multimedia.png);
	background-repeat:no-repeat;
	height:30px;
	width:160px;
}

.navi-left {
	list-style:none;
	margin:0;
	padding:0;
}

.navi-left li {
	margin:0;
	padding:0; 
}

.navi-left li a {
	color:#FFFFFF;
	display:block;
	padding-left:3px;
	padding-right:3px;
	text-align:left;
	text-decoration:none;
}

.navi-left li a:hover {
	background-color:#336600;
	color:#FFFFFF;
}

#menu-right {
	float:right;
	width:200px;
}

#publicidad {
	height:90px;
	padding-bottom:5px;
	padding-top:5px;
	margin-left:auto;
	margin-right:auto;
	width:728px;
}

#content {
	height:auto;
	margin-bottom:10px;
	width:610px;
}

#footer {
	background-image:url(images/footer.png);
	background-repeat:no-repeat;
	height:80px;
	width:1000px;
}

#copyright {
	color:#FFF;
	height:50px;
	padding:15px;
	text-align:center;
	width:886px;
}

#logo-footer a{
	background-image:url(images/logo-footer.png);
	background-repeat:no-repeat;
	display:block;
	float:right;
	height:50px;
	margin:15px;
	width:69px;
}

#logo-footer a:hover {
	background-position: 0 -50px;
}
saludos!!!
  #2 (permalink)  
Antiguo 20/08/2009, 20:10
Avatar de alexk
Colaborador
 
Fecha de Ingreso: julio-2009
Ubicación: De vuelta al trono
Mensajes: 1.697
Antigüedad: 8 años, 5 meses
Puntos: 137
Respuesta: como poner un footer debajo de un div flotante

#footer{clear:both;}
chao y suerte!!!!...
  #3 (permalink)  
Antiguo 20/08/2009, 20:20
 
Fecha de Ingreso: agosto-2009
Mensajes: 292
Antigüedad: 8 años, 3 meses
Puntos: 5
Respuesta: como poner un footer debajo de un div flotante

muchas gracias alex ya habia puesto el clear:both; en el menu de la izquierda pero no paso nada y ni se me ocurrio ponerlo en el footer

saludos!!! y muchas gracias fue de mucha utilidad
  #4 (permalink)  
Antiguo 20/08/2009, 20:50
Avatar de alexk
Colaborador
 
Fecha de Ingreso: julio-2009
Ubicación: De vuelta al trono
Mensajes: 1.697
Antigüedad: 8 años, 5 meses
Puntos: 137
Respuesta: como poner un footer debajo de un div flotante

de nada WinderJerter que bueno chao y suerte!!! tiene buena pinta la web
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 00:06.