Background degradado en el body

lktmaster · #1 (**permalink**) 12/07/2011, 01:00

Hola,

Estoy haciendo un css con un degradado en el body, el problema és que le doy "width:100%; height:100%" y el height no me lo pilla, me hace todo el ancho de la pagina, pero no todo el alto.

Como seria la forma correcta de hacerlo?
Me funciona si pongo un "height:1000px" fijo, pero eso conlleva a que si és una pantalla menor me sale el scroll, y si és mayor me hace el resto blanco.

Hay forma de solucionar eso?

Muchas gracias

vgonga1986 · #2 (**permalink**) 12/07/2011, 03:37

Muestra el código donde haces el degradado.

lktmaster · #3 (**permalink**) 12/07/2011, 03:43

Aquí teneis el codigo.

Código HTML:

body {
	background: #007d7d;
	filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#007d7d', EndColorStr='#005697');
	background: -moz-linear-gradient(top, #007d7d, #005697);
	background: -webkit-gradient(linear, left top, left bottom, from(#007d7d), to(#005697));
	background: -o-linear-gradient(#007d7d, #005697);
	background: linear-gradient(top, #007d7d, #005697);
	width: 100%;
	height: 100%;
}

vgonga1986 · #4 (**permalink**) 12/07/2011, 03:54

Sinceramente, no sé qué problema tienes. Acabo de usar tu css con este código y se me pinta todo el fondo:

Código:

<html>
<head>
	<link rel="StyleSheet" type="text/css" href="test.css" />
</head>
<body>

</body>
</html>

Deduzco pues que el problema no lo tienes en la etiqueta body sino en las siguientes.

lktmaster · #5 (**permalink**) 12/07/2011, 04:22

A mi también me lo pinta todo, pero me salen pequeños degradados a linias de arriba a abajo, cuando el degradado mi idea és que sea un unico degradado de arriba a abajo.

Si cambias el codigo de height por el que te dejo aquí verás lo que quiero decir, pero no quiero poner un tamaño fijo.

Código HTML:

body {
	background: #007d7d;
	filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#007d7d', EndColorStr='#005697');
	background: -moz-linear-gradient(top, #007d7d, #005697);
	background: -webkit-gradient(linear, left top, left bottom, from(#007d7d), to(#005697));
	background: -o-linear-gradient(#007d7d, #005697);
	background: linear-gradient(top, #007d7d, #005697);
	width: 100%;
	height: 850px;
}

vgonga1986 · #6 (**permalink**) 12/07/2011, 04:31

Qué tienes dentro del body?

lktmaster · #7 (**permalink**) 12/07/2011, 04:50

Una web entera...

creo que no te he entendido

vgonga1986 · #8 (**permalink**) 12/07/2011, 04:53

Me refería que lo pusieras, pero no todo, simplemente qué elemento tienes dentro del body, tienes varios o uno único. Vamos, lo que quiero es que me pongas el código de <body> y los elementos de primer nivel dentro del mismo.

lktmaster · #9 (**permalink**) 13/07/2011, 02:14

De echo tengo una tabla con 5 <a><img></a> dentro así tal qual. para que se me centre, la idea és muy parecida a la pagina inicial de moritz http://www.moritz.com/ si miras el html és casi identico al que tengo yo, pero no uso ninguna imagen de fondo

vgonga1986 · #10 (**permalink**) 13/07/2011, 04:30

Buenas de nuevo.

Si te soy sincero, no soy capaz de reproducir tu error, he compiado el código de la página que me das y me sigue saliendo el degradado completo, pégame, si quieres el código de la página directamente, a ver si así soy capaz de ver tu error.

Un saludo.

forco · #11 (**permalink**) 04/08/2011, 02:28

En realidad está funcionando correctamente.
Se aplica el degradado en el body. Que es la primera franja que ves.
Luego se repite hasta llenar la ventana del navegador.
Si no quieres ver las franjas tienes que añadir:
background-repeat: no-repeat;