28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

je suis actuellement en train de modifier un site internet, et je bloque sur un problème.
Je voudrais avoir un site en design extensible avec de chaque coté deux barres qui contiendrait une image ; voilà un schéma :
http://img406.imageshack.us/img406/2926/testsne.png
En rouge, c'est le fond de ma page (qui sera une petite image appliquée en mosaïque), en noir le corps de ma page, et de chaque côté une bande de 20 pixels de large, qui contiendra une image de dégradé avec transparence, afin de faire une transition douce entre le fond et le corps.
Le problème, c'est que je ne vois pas comment faire une div qui prendra toute la hauteur de l'écran de l'utilisateur quand il n'y a pas assez de texte pour prendre toute une page.

Donc avez-vous une idée ? Merci d'avance Smiley smile
Hello,

@jQz > que tu proposes des liens vers le site du zero en ce qui concerne php est une chose mais c'est un peu dommage lorsqu'il s'agit du css. Smiley cligne

Ce que je te disais de leurs tutos php est également vrai pour le css (en tout cas pour celui-ci) : ils ne sont pas toujours très carrés.

Rien de bien méchant mais :
* lorsque l'on fixe une dimension à 0 il est inutile de spécifier l'unité (0 à la place de 0px).
* que vient faire outline ici ?
* il semble plus judicieux d'affecter un min-height: 100% plutôt qu'un height: 100% à #page
* la phrase "C'est un des problèmes de Height: 100%, la plupart des navigateurs ne savent pas comment l'interpréter" est erronée : simplement une dimension en pourcentage se réfère à une autre valeur (pour height il s'agit de celle du bloc conteneur et cela oblige à spécifier dans l'exemple donné height:100% à body et html qui eux-mêmes se réfèrent aux dimensions du viewport).
* width:100% est inutile puisque pour un élément de type bloc c'est la valeur par défaut.

En résumé je préfère l'astuce de Raphaël. Smiley smile
Modifié par Heyoan (02 Aug 2009 - 22:43)
Oui, après libre à toi de choisir l'une des deux méthodes, néanmoins celle de Raphaël semble être mieux adaptée.