Posicion relativa

[josemota]

Hola,

Estoy empezando con css y no termino de entender mucho esto. Veréis, hasta el momento yo todo lo estaba haciendo con position:absolute

Código:

/* CSS Document */

.banner { background-image:url(header.png);
		position:absolute;
		z-index:1;
		width:100%;
		height:100%;
		left:10%;
                top:5%;
		background-repeat:no-repeat;
		}

		}

Esto queda muy bien para mi resolución, pero obviamente al jugar tanto con los % en otra resolución distinta no tiene nada que ver. Por ello probé con position:relative y quitandole los top y left que tengo en el css.

Pero haciendolo así, no me lo muestra bien, por ejemplo. Si el banner ocupa de alto 200px si no le pongo texto no me lo muestra y si quiero que me lo muestre entero, tengo que ir poniendole texto.

Por ejemplo así:

Código:

<div class="banner">fffffffff<br />fffff<br />fffffffff<br />ffffffffff<br />ffffffffff<br />ffffffffff<br />fffffffffff<br /> fffffffffffff </div>

de esta forma si muestra todo el banner entero. Yo lo que quiero es que me lo muestre todo sin necesidad de incluir texto.

Saludos

[comablck]

pues, por lo q te entiendo, queres q muestre el alto de los 200px sin necesidad de tener contenido verdad? entonces lo q tenes q hacer es darle el width y height en pixeles, por ejemplo.. width:800px; height:200px; e imagino q lo queres centrado.. entonces el css q podrias probar seria algo asi:

.banner {
width: 800px;
height: 200px;
margin: 0 auto;
}

[josemota]

Muchas gracias. Funciona Perfecto