Discussion :

[Zoro63]

Bonjour,
Je voudrais pourvoir redimmensionner mon image dans la balise INPUT mais je sais pas comment faire, voilà ce que j'ai fais.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<style>
.image_envoi {
	width: 60%;
	height: 60%;
}
</style>
 
 
<form method="post" action="recoipointcarte.php">
      <div class="image_envoi">
        <input type="image" name="Achat" src="Achat.jpg" class="image_envoi"/>
      </div>
</form>

Pour votre aide merci.

[c_s_s]

Bonjour,

Tu peux te contenter de mettre la largeur en pourcentage. La hauteur changera de la même façon.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
.image_envoi {
	width: 60%;	
}

L'image fera alors 60% de son conteneur.

[HiRoN]

Salut,

Je voudrais pourvoir redimensionner mon image dans la balise INPUT

Plus précisement ?

Si tu met :

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

<input value="" type="image" class="image_envoi"/>

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
.image_envoi {
display:block;
background:url(img/test.gif) no-repeat; /* Image en background */
width:50px; /* Largeur Bouton & donc Image */
height:18px; } /* Hauteur Bouton & donc Image */

L'image est défini en background sur l'input et donc la taille du bouton fais la taille de l'image (avec une image correspond à la taille du bouton que tu veux)

[HiRoN]

Bonjour,

Tu peux te contenter de mettre la largeur en pourcentage. La hauteur changera de la même façon.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
.image_envoi {
	width: 60%;	
}

L'image fera alors 60% de son conteneur.

Interêt du truc ? Pk appelé 2 fois la class "image_envoi" (sensé contenir une image non ?) autant sur l'input que sur son conteneur ?

[c_s_s]

Je n'ai jamais dit qu'il fallait mettre la class "image_envoi" sur le conteneur.

Je me suis contenté d'apporter une correction au CSS de Zoro63 (en supprimant la définition de la hauteur).
Ensuite, j'ai juste précisé que la taille indiquée dans le css, si elle est exprimée en pourcentage, sera proportionnelle au conteneur du bouton input (qui peut être un bloc ou directement le body).

En gros, si la valeur indiquée dans le css est de 100%, l'image fera toute la largeur du conteneur, et pas la largeur intrinsèque de l'image.

Mon indication était là pour ne pas avoir de surprise et se retrouver avec une image grossie quinze fois.


Maintenant, peut-être que Zoro63 souhaite avoir une taille fixe, mais ça il ne le dit pas.

[HiRoN]

Je me suis contenté d'apporter une correction au CSS de Zoro63 (en supprimant la définition de la hauteur).

Je ne dis pas le contraire, j'ai mal exprimé ma question

C'est juste que sur le coup, je n'avais pas vraiment compris l'intérêt d'englober l'input dans un div (ayant le même nom au niveau de la class).
En fait, le div conteneur sert juste de "resize" à l'input...

[Zoro63]

Merci pour votre aide mon erreur est corrigé. Mon image se redimensionne bien maintenant.