Probleme design et image de fond

Voilà bonjour à tous je vous expose mon probléme je dois creer un site internet pour un projet et je voudrais que le design du site soit ajustable en fonction de la taille de l'écran. Je connais la démarche a suivre mais cependant j'ai un souci au niveau de la banniére du haut (et du bas aussi d'ailleurs ) je m'explique j'ai defini ma div correspondant à la banniere à l'aide de % j'ai ensuite utilisé la syntaxe background-image dans mon fichier css pour inclure la banniere. Et la probléme la banniere ne s'affiche pas du tout je suis oblige de mettre une min-height et min-width pour que la banniere s'affiche et dans ce cas le design n'est plus ajustable. Que puis-je faire merci bien voici mon code css aidez moi s'il vous plait la ligne en rouge contient l'ajout de la banniere

@charset "utf-8";
/* CSS Document */
body{width:100%;height:100%}
* {background-color:rgb(204,255,102);}

[#red].banniereduhaut{min-height:102px;height:20%;width:80%;margin-left:4cm;background-image:url(Images/Banner3.gif);}	[/#]
.rech_rapide {height:10%;width:80%;margin-top:0.5cm; text-align:center;font-size:14px;}
.connexion {height:20%;width:20%;margin-top:0.5cm;float:right;}
.menu {height:20%;width:20%;margin-top:0.5cm;float:left;font-weight:bold;}
.menu a {color:rgb(51,153,0);text-align:center;font-family: Helvetica, sans-serif;}
.menu a { text-decoration: none; }
.menu dt {color:rgb(51,153,0);text-align:center;border-bottom:2px solid;border-color:rgb(255,153,0);font-size:18px;}
.menu a:hover{color:rgb(51,204,0);}
.menu ul {list-style-type: none;}
.menu li {border-bottom:1px solid;border-color:rgb(204,102,0);font-size:15px;margin-left:30px;font-style:italic;}

.contenu {height:90%;width:50%;margin-left:auto;margin-right:auto;margin-top:0.5cm;padding:5px;text-align:center;  }

Modifié par anthonydb1 (19 Nov 2008 - 16:27)

Quelqu'un aurait-il la gentillesse de répondre s'il vous plait

Bonsoir,

Une page en ligne est toujours ce qu'il y a de plus apprécié pour visualiser un problème.
Mais si l'élément de décor est contenu dans un <div> vide, il est normal que rien ne s'affiche puisqu'il concrètement il n'occupe aucune place.

Quel est exactement l'effet recherché ?

Bonjour,

pourquoi pas min-height en pourcentage également?
Mais sinon min-height çaÿlemal dans 95% des cas et on peut parfois le remplacer par un padding par ex. Ou un height. Ou une image HTML si c'est sémantique. Ou ...
Modifié par Felipe (20 Nov 2008 - 19:01)

Selon vous vu que la div est vide il faudrait donc que j'affiche quelque chose dans la div je ne mettrai donc plus mon image dans le css mais dans la div c'est ca. Et min-height en pourcentage ne fonctionne pas j'ai essayé

Ça peut en effet être une idée.
Comme évoquée par Felipe, le padding peut également répondre à tes attentes.

Sinon, ce que je ne comprends pas c'est l'effet souhaité...
L'image doit-elle être affichée en entier quelles que soient les circonstances ou doit-elle être rognées suivant la résolution utilisée ?

L'image doit bien etre affiché en entier quelque soit les circonstances et malheureusement là avec le min height si je réduit la fenetre du navigateur ben elle n'est plus affiché en entier. Voilà