Foros del Web » Creando para Internet » CSS »

Fondo se corta cuadno aparece mas info en la pantalla

Estas en el tema de Fondo se corta cuadno aparece mas info en la pantalla en el foro de CSS en Foros del Web. Hola a todos bueno tengo un problemita... Tengo un diseño de fondo y una sompra para reasaltar el cuerpo de la pagina... el problema que ...
  #1 (permalink)  
Antiguo 05/10/2009, 09:26
 
Fecha de Ingreso: octubre-2008
Mensajes: 112
Antigüedad: 9 años, 2 meses
Puntos: 1
Fondo se corta cuadno aparece mas info en la pantalla

Hola a todos bueno tengo un problemita...

Tengo un diseño de fondo y una sompra para reasaltar el cuerpo de la pagina... el problema que tnego es que mientras no haga falta mover el scroll se ve perfecto... pero.... cuando aparece mas info en la pantalla de la que entra sin mover el scroll se corta y la cuando bajamos el scroll no aparece nada dejo unas imagenes para que vean




En la imagen uno se ve como hasta donde el scroll no hace falta moverlo esta perfecto...
y en la segundo luego de la linea roja se ve como no hay mas fondo ni sombra.

les dejo el CSS

Código CSS:
Ver original
  1. HTML{height:100%;}
  2.  
  3. BODY{height:100%; margin:0;
  4. font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; color:#666666;
  5. }
  6.  
  7. #fondo{width:100%; height:100%; background-image:url(images/fondo.jpg); background-repeat:repeat;}
  8. #sombra{width:100%; height:100%; background-image:url(images/sombra.png); background-repeat:repeat-y; background-position:center;}
  9.  
  10.  
  11. #cuerpo{width:750px; height:100%; margin:auto;}
  12.  
  13. #cabecera{width:750px; height:151px;
  14. background-image:url(images/sombracab.jpg); background-repeat:repeat-x;}
  15.  
  16. #info{width:750px; height:100%;
  17. padding-left:5px; padding-right:5px; padding-top:5px;}

y ahora el HTML
Código HTML:
Ver original
  1. <link href="estilo.css" rel="stylesheet" type="text/css" />
  2. </head>
  3.  
  4. <body>
  5. <div id="fondo">
  6. <div id="sombra">
  7.  
  8. <div id="cuerpo">
  9.     <div id="cabecera">
  10.         <table cellspacing="0" width="100%">
  11.             <tr>
  12.                 <td align="center">
  13.                   <img src="images/logo.jpg" width="230" height="149" alt="Digesto Legal" />
  14.                 </td>
  15.           </tr>
  16.         </table>
  17.     </div>
  18.     <div id="info">
  19.  
  20. <p>
  21.   <SCRIPT LANGUAGE="JavaScript">
  22. function varitext(text)
  23. {
  24. text=document
  25. print(text)
  26. }
  27. </script>
  28.         <form method="post"
  29.     </form>
  30. <br /><br />
  31. <a href="admin.php">Volver a Administracin</a>
  32.         </div>
  33.     </div>
  34. </div>
  35. </div>
  36. </body>
  37. </html>

Elimine todo el form porque no era necesario que lo vieran...

Bueno espero puedan ayudarme

Desde ya muchas gracias

Saludos
  #2 (permalink)  
Antiguo 05/10/2009, 10:08
 
Fecha de Ingreso: noviembre-2008
Ubicación: W2.0
Mensajes: 103
Antigüedad: 9 años
Puntos: 1
Respuesta: Fondo se corta cuadno aparece mas info en la pantalla

Intenta esto:

BODY{height:100%; margin:0;
font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; color:#666666;background-image:url(images/fondo.jpg); background-repeat:repeat;
}
fondo{width:100%; height:100%;}
  #3 (permalink)  
Antiguo 05/10/2009, 10:27
 
Fecha de Ingreso: octubre-2008
Mensajes: 112
Antigüedad: 9 años, 2 meses
Puntos: 1
Respuesta: Fondo se corta cuadno aparece mas info en la pantalla

Si, ya lo habia intentado...

Eso me soluciona el tema del fondo con rayitas pero la sombra, no me lo arregla aqui la imagen


Ahh otra cosa que me gustaría solucionar es que al final de la pagina cuando no ocupa la totalidad con la información el Scroll esta activo eso lo genera el tamaño de la cabecera que soy 151 pixels aunque no haya información debajo me añade esos 151 pixels... hay forma de hacer que si no se ocupa toda la pagina no este el scroll activo???

Aqui la imagen:


Como ven todavia tengo el scroll activo y puedo seguir bajando pero la info termino mucho antes del final del tamaño inicial de la pantalla.

Saludos
  #4 (permalink)  
Antiguo 05/10/2009, 10:42
 
Fecha de Ingreso: noviembre-2008
Ubicación: W2.0
Mensajes: 103
Antigüedad: 9 años
Puntos: 1
Respuesta: Fondo se corta cuadno aparece mas info en la pantalla

#
#sombra{width:100%; height:100%; background-image:url(images/sombra.png); background-repeat:repeat-y; background-position:center;position:fixed;}

Me avisas si se soluciono.
  #5 (permalink)  
Antiguo 05/10/2009, 10:57
 
Fecha de Ingreso: octubre-2008
Mensajes: 112
Antigüedad: 9 años, 2 meses
Puntos: 1
Respuesta: Fondo se corta cuadno aparece mas info en la pantalla

Si pongo Position:fixed se me sale el scroll entonces no puedo bajar y ver como queda solo con puedo apretando TAB y que vaya desplazandose por el formulario... entonces le puse un scroll utilizando Overflow:Scroll.... y resulta que se me desplazo parte de la pagina a la izquierda...

Aqui la imagen:


Ahi tengo el Overflow colocado en la etiqueta sombra
Código CSS:
Ver original
  1. #sombra{width:100&#37;; height:100%; background-image:url(images/sombra.png); background-repeat:repeat-y; background-position:center;
  2. position:fixed; overflow:scroll;}

Si lo coloco en Body o cualquier otra etiqueta se muestra el scroll pero sin la barra entonces no se puede utilizar, como si no hubiera mas info para ver en la pagina.

Saludos y gracias por la ayuda que me estas dando... ojala me ayudes a solucionar esto
  #6 (permalink)  
Antiguo 05/10/2009, 11:24
 
Fecha de Ingreso: noviembre-2008
Ubicación: W2.0
Mensajes: 103
Antigüedad: 9 años
Puntos: 1
Respuesta: Fondo se corta cuadno aparece mas info en la pantalla

si le colocas las propiedades left:--x; top: 0px; le asignas la posicion.


Yo lo que hago es que a la imagen del body le asigno esta imagen de sombra. pero no se si te funcionaría.

Suerte.
  #7 (permalink)  
Antiguo 06/10/2009, 07:29
 
Fecha de Ingreso: octubre-2008
Mensajes: 112
Antigüedad: 9 años, 2 meses
Puntos: 1
Respuesta: Fondo se corta cuadno aparece mas info en la pantalla

Aun no lo puedo solucionar si por favor alguien puede ayudarme....

Se me sigue cortando el fondo y cuando bajo el scroll no aparece ni la sombra ni el fondo... y el tema es que que si pongo AUTO en las etiquetas height de sombra y de fondo funciona bien pero cuando la cantidad de info es menor a lo que entra en pantalla se corta el fondo antes....

Alguna idea???

Saludos
  #8 (permalink)  
Antiguo 06/10/2009, 07:36
 
Fecha de Ingreso: octubre-2008
Mensajes: 112
Antigüedad: 9 años, 2 meses
Puntos: 1
Respuesta: Fondo se corta cuadno aparece mas info en la pantalla

Bien ya lo solucione, lo que hice fue crear la imagen del fondo de 3 pixels de alto y de 3000 de ancho, luego le puse position Center y listo tengo sombra y fondo en la misma imagen... eltema es si alguien tiene una resolucion superior a 3000 de ancho jejeje..

Saludos
  #9 (permalink)  
Antiguo 06/10/2009, 09:47
 
Fecha de Ingreso: noviembre-2008
Ubicación: W2.0
Mensajes: 103
Antigüedad: 9 años
Puntos: 1
Respuesta: Fondo se corta cuadno aparece mas info en la pantalla

Prueba esto y me cuentas:

HTML{height:100%;}

BODY{height:100%; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; color:#666666;background-image:url(images/fondo.jpg); background-repeat:repeat-y; background-position:center;}

#fondo{width:750px;height:auto; background-repeat:repeat-y; margin:0px auto 0px auto;background-image:url(images/sombra.png); }

#sombra{width:100%; height:100%; }

#cuerpo{width:750px; height:100%;}

#cabecera{width:750px; height:151px;
background-image:url(images/sombracab.jpg); background-repeat:repeat-x;}
#info{width:750px; height:100%;padding-left:5px; padding-right:5px; padding-top:5px;}

Me dices como queda para poder solucionarlos completamente.
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 06:30.