Foros del Web » Creando para Internet » CSS »

Plantillas CSS

Estas en el tema de Plantillas CSS en el foro de CSS en Foros del Web. Hola! muy buenas. Estoy intentando crear una plantilla CSS para aplicar a mi sitio web usando CSS. El diseño sería típico: Cabecera, Contenido con dos ...
  #1 (permalink)  
Antiguo 24/07/2008, 05:24
 
Fecha de Ingreso: julio-2008
Mensajes: 2
Antigüedad: 9 años, 4 meses
Puntos: 0
Plantillas CSS

Hola! muy buenas.

Estoy intentando crear una plantilla CSS para aplicar a mi sitio web usando CSS.

El diseño sería típico:

Cabecera, Contenido con dos columnas y Pie.

Gracias a los trucos que leí por aquí conseguí poner el pie siempre pegado a la parte inferior del navegador. Pero siguiendo esta regla no consigo que el contenido central de las dos columnas también estire su altura hasta el pie que tengo abajo del todo.

¿Alguna idea? Espero haberme explicado bien.

Muchas gracias!
  #2 (permalink)  
Antiguo 24/07/2008, 09:27
Avatar de Raulmmmm  
Fecha de Ingreso: marzo-2007
Ubicación: En otro lugar que tú
Mensajes: 1.549
Antigüedad: 10 años, 8 meses
Puntos: 36
Respuesta: Plantillas CSS

Pon las dos columnas dentro de un div llamado "estirar" por ejemplo, y pon esto en el CSS:
Código:
#estirar { overflow: hidden; }
#columnauno, #columnados { margin-bottom: -3000px; padding-bottom: 3000px; }
  #3 (permalink)  
Antiguo 28/07/2008, 06:16
 
Fecha de Ingreso: abril-2005
Mensajes: 80
Antigüedad: 12 años, 7 meses
Puntos: 0
Respuesta: Plantillas CSS

pues a mi sólo me funciona en el ie7
  #4 (permalink)  
Antiguo 28/07/2008, 15:06
Avatar de Raulmmmm  
Fecha de Ingreso: marzo-2007
Ubicación: En otro lugar que tú
Mensajes: 1.549
Antigüedad: 10 años, 8 meses
Puntos: 36
Respuesta: Plantillas CSS

Un pequeño detalle del clear:both, ya está solucionado y funciona en IE y Firefox:
Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">
<head>
<title>Dos columnas misma altura</title>
<style type="text/css">
#contenedor { overflow: hidden; }
#menu { float: left; width: 15%; background: #eee; margin-bottom: -3000px; padding-bottom: 3000px; }
#texto { float: left; width: 85%;  margin-bottom: -3000px; padding-bottom: 3000px; }
.clear { clear: both; }
</style>
</head>
<body>
<div id="contenedor">
<div id="menu">
Este es el menú
</div>
<div id="texto">
Este es el texto<br />
Hola
</div>
<div class="clear"></div>
</div>
</body>
</html> 

Última edición por Raulmmmm; 29/07/2008 a las 01:48
  #5 (permalink)  
Antiguo 28/07/2008, 17:06
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Plantillas CSS



Te ha pasado como me suele pasar a mi, que te has dejado el title del ejemplo anterior en este, que no tiene nada que ver.

Un detalle: siempre veo que con el corte recomiendas añadir el div <div style="clear: both"></div> y siempre pienso lo mismo, que para mi es preferible quitar los estilos de las etiquetas, por eso al contrario yo recomiendo siempre el div <div class="corte"></div> y el css .corte {clear: both;}. Cuesta algo más explicarlo, pero creo que es mejor, ¿no?
__________________
Visita mi nueva web idplus.org
  #6 (permalink)  
Antiguo 29/07/2008, 01:33
Avatar de Raulmmmm  
Fecha de Ingreso: marzo-2007
Ubicación: En otro lugar que tú
Mensajes: 1.549
Antigüedad: 10 años, 8 meses
Puntos: 36
Respuesta: Plantillas CSS

¡Anda, el title ! Gracias por decírmelo. Y en cuanto a eso, yo lo tengo como dices tú, pero no me suele apetecer explicarlo . A ver si ya me pongo las pilas.
  #7 (permalink)  
Antiguo 29/07/2008, 02:31
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Plantillas CSS

Cita:
Iniciado por Raulmmmm Ver Mensaje
Y en cuanto a eso, yo lo tengo como dices tú, pero no me suele apetecer explicarlo . A ver si ya me pongo las pilas.
Sabía que era pereza Me voy a pegar la explicación en un archivo en algún sitio y así será copy & paste
__________________
Visita mi nueva web idplus.org
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 19:06.