28172 sujets

CSS et mise en forme, CSS3

Adapter mon image de background à largeur de ma div

Bonjour,
J'ai une div qui s'agrandit en largeur en fonction de si un module est publier à côté ou non.
Je voudrais que mon image de background s'étire en largeur en fonction de cette largeur. est-ce possible en css ?
Merci pour vos infos
salut,

si c'est une image en background tu n'as pas la possibilité de le faire. contrairement à une image placé dans une div.

si c'est une image placé dans une div tu appliques le css suivant :



div.image { width: 20%;
                height: 20%;
                padding: 0;
                margin: 0;
              }

img { width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
      }


html:


<div class="image">
   <img src="..\repertoiresource\fichiersource" alt="" />
</div>
Bonsoir,

Cela dépend aussi de la conception. Certaines images peuvent s'adapter (c'est un trucage) à la largeur de la div. En utilisant background-position: center - l'image se découvre ou se cache progressivement de gauche comme de droite. Parfois, avec certains designs ça le fait bien. Il faut prévoir une image qui soit aussi grande que la taille maximum et dont la partie "visiblement indispensable" soit aussi petite que la taille minimum.
Et est-ce que l'inverse est possible ? C'est à dire d'adapter la taille de la div totale à la taille de l'image ?..
Je réalise une page produit pour une boutique eBay, et j'aimerais centrer l'image en adaptant la taille du div (contenant un lien pour avoir un zoom) à l'image, sachant que la page produit sera utilisée pour différents articles dont la taille de photo diffère..

<div class="image">
		<img alt="" src="image.jpg" />
		<div class="zoom">
			<a alt="zoom" href="image.jpg">
			<p><img alt="" src="loupe.png" style="" />
			Cliquez pour agrandir</p></a>
		</div>
	</div>


J'aimerais que le bloc (contenant l'image) et le bouton zoom s'adaptent à la taille de l'image.

Merci d'avance.. Smiley ohwell
Modifié par Roul (10 May 2010 - 16:12)
Sujet clos
Aller à