Page HTML en CSS qui s'adapte à la résolution

Fermé
jp.bond - 16 juin 2009 à 19:14
 jp.bond - 17 juin 2009 à 09:13
Bonjour,
je cherche à développer une page simple dont la largeur s'adapte à la largeur de l'écran du visiteur.
En gros, j'ai un menu en image, et j'aimerai que une de ces images (un fond uni) s'agrandisse au maximum pour que le menu prenne toujours toute la largeur de la page... je sais le faire avec des tableaux, mais j'aimerai le faire avec des div et css.
Car malgré mes essais, si je mets mon image "élastique" à width="100%", l'image ne s'adapte pas à la résolution mais se place à la ligne, et les images suivantes vont à la ligne suivantes. (en gros, elle prend effectivement 100% de la page en largeur...)
Ca doit etre un petit détail mais je sèche...

merci de votre aide !

voila mon code :
<div id="Table_01">
<div id="bandeau-top-left"><img src="images/bandeau_top_left.jpg" width="608" height="41" alt=""></div>
<div id="bandeau-top-pourcent"><img src="images/bandeau_top_pourcent.jpg" width="100%" height="41" alt=""></div>
<div id="bandeau-top-right"><img src="images/bandeau_top_right.jpg" width="310" height="41" alt=""></div>
</div>

et voila ma css :
#Table_01 {
top:0px;
width:100%;
position: absolute;
}

#bandeau-top-left {
float: left;
height: 41px;
width: 608px;
}

#bandeau-top-pourcent {
width:100%;
height:41px;
float: left;
}

#bandeau-top-right {
width:310px;
height:41px;
float: left;
}
A voir également:

3 réponses

sayu, pas de soucis pour l'image, c'est une image en pleine couleur donc elle pixelera pas

jnk972, si j'enleve le width et height du html, le div va s'étendre mais pas l'image...car le width et height du html sont des attribut de l'image alors que dans la css ce sont les attributs du div...
2
Sayu Messages postés 377 Date d'inscription samedi 4 octobre 2008 Statut Membre Dernière intervention 20 avril 2010 60
16 juin 2009 à 19:20
Je ne sais pas comment faire, mais je vois deja un probleme :
votre argumment width="100%" est relatif a l'image. Votre image sera etendu a la largeur de votre fenetre, ce qui la pixelisera si jamais c'est une grade fenetre...

Je cherche et je tente de vous trouver une solution.

Cordialement,
1
jnk972 Messages postés 63 Date d'inscription dimanche 26 octobre 2008 Statut Membre Dernière intervention 1 décembre 2009 10
16 juin 2009 à 19:55
deja tu peux enlever le width et height du html

#table01 rajoute float
1