Foros del Web » Creando para Internet » CSS »

Problema con DTD

Estas en el tema de Problema con DTD en el foro de CSS en Foros del Web. Estoy tratando de hacer un formulario de contacto, y tengo el div.container con el height al 100%. Sin declaración DTD funciona bien, pero con la ...
  #1 (permalink)  
Antiguo 20/01/2011, 15:30
Avatar de _cronos2
Colaborador
 
Fecha de Ingreso: junio-2010
Mensajes: 2.062
Antigüedad: 7 años, 6 meses
Puntos: 309
Problema con DTD

Estoy tratando de hacer un formulario de contacto, y tengo el div.container con el height al 100%. Sin declaración DTD funciona bien, pero con la XHTML 1 Transitional me limita el tamño del div hasta la parte de abajo del último elemento en su interior (creo que me he explicado un poco mal, si no se me entiende puedo pasar u screenshot). El código es este:
Código HTML:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <title>Contacto</title>
  4. <style type="text/css">
  5. body {background:#000;}
  6. .container {
  7.  width:50%;
  8.  /* Aquí está el problema */
  9.  height:100%;
  10.  background:#333;
  11.  color:#F63;
  12.  margin-left:25%;
  13.  border-radius:1.5em;
  14.  -moz-border-radius:1.5em;
  15.  -webkit-border-radius:1.5em;
  16.  font-family:Calibri;
  17. }
  18. .title {font-size:3em; text-align:center;}
  19. .text {font-size:1em; margin-left:1em;}
  20. .input {margin-left:0.5em;}
  21. .input:focus {border:0.1em solid #F60;}
  22. </head>
  23. <div class='container'>
  24.  <div class='title'>Contacta con nosotros</div>
  25.  <!-- etc. etc. -->
  26. </div>
  27. </body>
  28. </html>
¿Cómo puedo solucionarlo?
Saludos (:
__________________
" Getting older’s not been on my plans
but it’s never late, it’s never late enough for me to stay. "
Cigarettes - Russian Red
  #2 (permalink)  
Antiguo 21/01/2011, 10:06
 
Fecha de Ingreso: noviembre-2010
Mensajes: 47
Antigüedad: 7 años
Puntos: 2
Respuesta: Problema con DTD

Mmm si mal no entiendo lo que necesitas es cambiar el height 100%, por overflow hidden.

Si puedes colocar el screenshot sería de mucha ayuda.

Saludos
  #3 (permalink)  
Antiguo 21/01/2011, 12:45
Avatar de _cronos2
Colaborador
 
Fecha de Ingreso: junio-2010
Mensajes: 2.062
Antigüedad: 7 años, 6 meses
Puntos: 309
Respuesta: Problema con DTD

Aquí están los screenshots:
1.- Con DTD

2.- Sin DTD

Como puedes ver en la 1º la altura es mucho menor, pero sigue estando al 100% como en la 2º. Muchas gracias por contestar.
Saludos (:
__________________
" Getting older’s not been on my plans
but it’s never late, it’s never late enough for me to stay. "
Cigarettes - Russian Red
  #4 (permalink)  
Antiguo 21/01/2011, 13:23
 
Fecha de Ingreso: noviembre-2010
Mensajes: 47
Antigüedad: 7 años
Puntos: 2
Respuesta: Problema con DTD

Mmmm veo..

Puedes probar colocando esto en tu css

html, body {
margin:0;
height:100%;
}

Si no te funciona de esta manera puedes intentar colocándole a la clase container position:absolute

Saludos
  #5 (permalink)  
Antiguo 21/01/2011, 13:33
Avatar de _cronos2
Colaborador
 
Fecha de Ingreso: junio-2010
Mensajes: 2.062
Antigüedad: 7 años, 6 meses
Puntos: 309
Respuesta: Problema con DTD

Muchas gracias! Al final lo solucioné así:
Código CSS:
Ver original
  1. body {
  2.  background:#000;
  3.  /* Quería un poco de margen XD */
  4.  margin:1em;
  5. }
  6. html, body {height:100%}
Saludos y gracias de nuevo (:
__________________
" Getting older’s not been on my plans
but it’s never late, it’s never late enough for me to stay. "
Cigarettes - Russian Red
  #6 (permalink)  
Antiguo 21/01/2011, 14:03
 
Fecha de Ingreso: noviembre-2010
Mensajes: 47
Antigüedad: 7 años
Puntos: 2
Respuesta: Problema con DTD

Qué bueno que lo hayas solucionado ;D

Saludos
  #7 (permalink)  
Antiguo 21/01/2011, 15:18
Avatar de sanxuan  
Fecha de Ingreso: enero-2011
Ubicación: Gijón
Mensajes: 671
Antigüedad: 6 años, 11 meses
Puntos: 36
Respuesta: Problema con DTD

Personalmente prefiero la siguiente opción:

.container {
width:50%;
left:25%;
top:1em; /*El margen superior que quieras dejar*/
bottom:1em; /* El margen inferior que quieras dejar */
overflow: scroll; /* es necesario manejar el contenido que supere el alto de la página*/
height:auto;
position:absolute;
}

Tu método me da algunos problemas con los márgenes. El fin del contenedor me queda por debajo del borde inferior de la página.
De todas maneras sólo pretende ser una alternativa más.

Etiquetas: dtd
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 21:53.