Foros del Web » Creando para Internet » CSS »

Div al 100% me queda todo mal

Estas en el tema de Div al 100% me queda todo mal en el foro de CSS en Foros del Web. Bueno, estoy dando mis primeros pasos con las capas y el css, y ya tengo muchos tropezones... Para que sea más gráfico subi la web ...
  #1 (permalink)  
Antiguo 11/08/2009, 17:56
Avatar de vb2005  
Fecha de Ingreso: noviembre-2005
Ubicación: Paderborn - Alemania
Mensajes: 523
Antigüedad: 12 años
Puntos: 19
Div al 100% me queda todo mal

Bueno, estoy dando mis primeros pasos con las capas y el css, y ya tengo muchos tropezones...

Para que sea más gráfico subi la web de prueba para que se vea mejor: http://maxtor.l2inside.org/

La idea es que el bloque central su altura ocupe el 100% hasta que choque contra los dos bloques de abajo (amarillo y azul).

y que además el backgrond de las dos cajas de los costados se repita todo.

El mayor problema es que la caja no solo no ocupa 100% sinó que es lo más chiquita que puede osea no me da bola...

Les dejo el codigo CSS:
Código:
/*
Style for MaxtorGames 20/07/2009
Last modification: 07/08/2009
*/

html, body
{
	height:95.5%;
	font-family: Verdana, arial, sans-serif;
	background:url(images/back.png) repeat-x;
	vertical-align:top;
	margin-left:0px;
	margin-top:0px;
	font-size: 1em;
	outline: 0;
}
#contenedor
{
	min-height:100%;
	height: auto!important;
}
.link_sm
{
	color:#000;
	background-color: white;
}
#footer
{
	text-align: center;
	background-color: #366;
	color: #fff;
	height: 74px;
	margin-top: -74px;
}
.ejemplo
{
	position:relative;
	top: 0.5em;
	font-size: 1.2em;
}
.error_text
{
	color:#F00;
	background-color: #e8e8e8;
	border: 1px solid;
	font-weight:bold;
}
.comment_avatar
{
	width:86px;
	height:100%;
	float:left;
	border-right:dashed 3px #CCC;
}
.comment_content
{
	border: solid 2px #000;
	border-bottom: 0px;
	border-left:0px;
	border-right:0px;
	overflow:hidden;
}
.comment_area
{
	border:1px #000 solid;
	background-color:#EAEAEA;
}
.comment_date
{
	border-bottom:solid #999 1px;
	width:100%;
}
.comment_text
{
	width:650px;
	height:120px;
	text-align:inherit;
	overflow:hidden;
}
.comment_text_table
{
	border:0;
	width:650px;
	height:120px;
	vertical-align:top;
}
.good_text
{
	color:#090;
	font-weight:bold;
}
.contenido
{
	width:768px;
	height:100%;
	float:left;
	background-color:#FFFFFF;
}
.sm
{
	list-style:none;
	width:700px;
	height:150px;
	display:block;
	overflow:hidden;
}
.sm li
{
	float:left;
	display:inline;
	overflow:hidden;
}
.login_box
{
	position:fixed;
	bottom:50%;
	left:40%;
	opacity:0.95;
	filter:alpha(opacity=95);
}
.total
{
	position:fixed;
	background-color:#333;
	opacity:0.4;
	filter:alpha(opacity=40);
	width:100%;
	height:100%;
	top:0;
}
.close_cross
{
	color:#000;
}
.close_cross:hover
{
	background-color:#000;
	color:#FFF;
}
.iframe_foro
{
	background-repeat:repeat;
	border-collapse:collapse;
	border:solid 1px;
}
.search_box
{
	height:18px;
	width:200px;
	border:0px;
}
/*Table backgrounds*/
.contenido_left
{
	background:url("./images/menu_02.png") repeat-y;
	width:16px;
	height:100%;
	float:left;
}
.contenido_right
{
	background:url("./images/menu_04.png") repeat-y;
	width:14px;
	display:block;
	height:100%;
	float:right;
}
.login_box_top
{
	background:url("images/login_02.png") repeat-x;
}
.login_box_left
{
	background:url("images/login_04.png") repeat-y;

}
.login_box_right
{
	background:url("images/login_06.png") repeat-y;
}
.login_box_bottom
{
	background:url("images/login_08.png") repeat-x;
}
/*Structures of divs*/
.menu_contenido
{
	min-height:100%;
	height:auto;

	width:798px;
	border:0px;
	margin-right:auto;
	margin-left:auto;
}
.menu_middle_content
{
	width:798px;
	height:100%;
}
.menu_titulo
{
	width:798px;
	height:40px;
}
.menu_bottom
{
	width:798px;
	height:29px;
}
.slide_game_container
{
	border:0px;
	height:150px;
	text-decoration:none;
}
.slide_game_info_image
{
	width:100%;
	height:110px;
}
.slide_game_container_bloque
{
	border:0px;
	height:150px;
	text-decoration:none;
}
.slide_image
{
	width:86px;
	height:110px;
}
/*.slide_image_bloque
{
	width:86px;
	float:left;
	height:110px;
}*/
.slide_image_bloque
{
	float: left;
	border: 0px;
	padding: 0px;
	width: 80%;
}
.slide_image_bloque a
{
	text-decoration:none;
	color:#000;
}
.slide_image_bloque a:hover
{
	text-decoration:underline;
	color:#000;
}
.slide_image_bloque img
{
	float: left;
	margin: 0px 5px 0px 0px;
}
.slide_info
{
	width:150px;
	height:60px;
	float:right;
}
.game_description
{
	width:150px;
	float:right;
	height:110px;
}
.game_description a
{
	text-decoration:none;
	color:#000;
}
.game_description a:hover
{
	text-decoration:underline;
	color:#000;
}
/*.game_description_bloque
{
	width:150px;
	float:right;
	margin: 5px;
	height:110px;
}*/
.slide_game_name
{
	display:block;
	font-weight:bold;
	min-width:100%;
	width:100%;
	text-decoration:none;
}
.slide_game_name a
{
	text-decoration:none;
}
.header
{
	height:130px;
	text-align:center;
}
.definitive_02
{
	width:100%;
	height:9px;
	text-align:center;
}
.search_tab
{
	background-color:#FFF;
	height:22px;
	width:203px;
	float:left;
}
.definitive_03
{
	width:449px;
	height:29px;
	margin-top:0px;
	margin:0px;
	float:left;
}
.definitive_05
{
	width:148px;
	height:29px;
	float:right;
}
.menu_bar_content
{
	width:800px;
	height:29px;
	display:block;
	margin-right:auto;
	margin-left:auto;
}
.bajo_search_box
{
	width:203px;
	height:7px;
	float:left;
}
.align_menu_bar_content
{
	width:100%;
	height:29px;
	text-align:center;
}
.cat_box
{
	height:122px;
	text-align:center;
}
.juego_left
{
	background:url("images/Game_02.png") repeat-y;
}
.juego_right
{
	background:url("images/Game_07.png") repeat-y;
}
.bloques
{
	width:800px;
	margin-right:auto;
	margin-left:auto;
}
.contenedor_bloques
{
	width:100%;
	height:192px;
}
.bloque_azul
{
	width:50%;
	margin-top:32px;
	float:left;
}
.bloque_amarillo
{
	width:50%;
	margin-top:32px;
	float:right
}
.bloque_medio
{
	height:100px;
	width:100%;
}
.bloque_medio_left
{
	width:10px;
	height:123px;
	background:url("./images/bloque1_02.png");
	float:left;
}
.bloque_medio_middle
{
	background-color:#FFF;
	height:123px;
	width:383px;
}
.bloque_medio_right
{
	width:8px;
	height:123px;
	float:right;
	background:url("./images/bloque1_04.png");
}
.titulo_bloque_azul, .titulo_bloque_amarillo
{
	width:402px;
	height:40px;
}
.bloque_footer
{
	width:402px;
	height:29px;
}
.bold_text
{
	font-weight:bold;
}
.categoria_juego{
	width:124px;
	float:left;
	border: 1px solid;
	border-right:0px;
	border-left:0px;
	margin:auto;
	padding: 5px;
}
#new_row{height:150px;}
.categoria_juegos{
	height:100%;
	margin:5px;
}
Cualquier cosa que no sepan o me expresé mal, pregunten.

Desde ya! MUCHAS GRACIAS!
__________________
www.marcher.com.uy - Web personal
Nerd's Corner - Desarrollo de software a medida

Última edición por vb2005; 11/08/2009 a las 18:07 Razón: algunas palabras mal escritas
  #2 (permalink)  
Antiguo 11/08/2009, 18:50
Avatar de emiliodeg  
Fecha de Ingreso: septiembre-2005
Ubicación: Córdoba
Mensajes: 1.830
Antigüedad: 12 años, 3 meses
Puntos: 54
Respuesta: Div al 100% me queda todo mal

agregarle .menu_contenido{overflow:hidden;}
con eso se va a mejorar
__________________
Degiovanni Emilio
developtus.com
  #3 (permalink)  
Antiguo 12/08/2009, 05:19
Avatar de vb2005  
Fecha de Ingreso: noviembre-2005
Ubicación: Paderborn - Alemania
Mensajes: 523
Antigüedad: 12 años
Puntos: 19
Respuesta: Div al 100% me queda todo mal

gracias lo voy a probar
__________________
www.marcher.com.uy - Web personal
Nerd's Corner - Desarrollo de software a medida
  #4 (permalink)  
Antiguo 13/08/2009, 11:58
Avatar de vb2005  
Fecha de Ingreso: noviembre-2005
Ubicación: Paderborn - Alemania
Mensajes: 523
Antigüedad: 12 años
Puntos: 19
Respuesta: Div al 100% me queda todo mal

Buenas, primero antes que nada perdon por el doble post, pero despues, gracias a emilideg, el overflow:hidden algo mejoró.

Pero fijate que contenido_left y contenido_right siguen siendo pequeños y no se repite el background cosa que queda feo.

Muchas gracias y saludos
__________________
www.marcher.com.uy - Web personal
Nerd's Corner - Desarrollo de software a medida
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 04:45.