bonjour à tous,

voilà mon problème:

je suis en train de travailler sur la css de mon blog et j'aimerais que lorsque l'on poste un billet dans ce blog, la largeur de limage que l'on a insérée dans ce billet s'ajuste automatiquement à la largeur du cadre des billets une fois postée.

par ex: si mon image fait 400 pixels de largeur et que dans ma css, j'ai estimé que les cadres de mes billets faisaient 200 pixels, je voudrais que l'image soit automatiquement redimensionnée pour apparaitre 2 fois plus petite et donc ne pas déborder du cadre.

merci d'avance pour vos conseils Smiley smile
Modifié par clemini (15 Feb 2007 - 09:48)
Pour cela tu dois déjà enlever tout attribut html de taille à ton image
mais dans le cas d'un agrandissement, l'image doit s'agrandir
homothétiquement donc je crains que ça ne puisse pas fonctionner.
merci pour le faq Smiley smile

j'ai donc compris qu'il fallait insérer le code

width: 100%


pour que la largeur de l'image se redimensionne automatiquement sur la taille du cadre.

mais il reste une inconnu:

supposons que le cadre dans lequel cette image sera inséré ait pour code


 #container #main {
clear:both;
float:left;
width:550px;
}


je dois ajouter quelque chose du type



#container #main {
clear:both;
float:left;
width:550px; img-width:100%
}



c'est bien ça?
Modifié par clemini (15 Feb 2007 - 09:54)
Bonjour clemini.

Pourrais-tu entourer le code dans tes messages avec les balises [ code] & [ /code] (sans espaces) comme demandé dans les règles du forum, stp ?

La propriété img-width n'existe pas. Si tu insères l'image dans le cadre #main dans le code html, tu dois utiliser un sélecteur CSS indiquant au navigateur que tu veux atteindre les images (img) à l'intérieur de #main. Le sélecteur CSS qui joue ce rôle est simplement l'espace :
#main img {
   width: 100%;
}
Je te conseille vivement de relire quelques articles sur le fonctionnement des feuilles de style (ici ou , voire les 2).
clemini a écrit :
merci c'est ce que je cherchais Smiley cligne
Dans ce cas, merci de marquer ton sujet comme [Résolu] et de prendre en compte la remarque de Thomas concernant ton code.