Taille des input

Taille
Html
Css
Input

vanessa -
blackcat - 17 sept. 2016 à 21:52

Bonsoir , quand on crée un zone de texte <input type="text" ...> est ce qu'on peut définir la taille du rectangle où on tape le texte ?

merci

Répondre (12)

A voir également:

Taille input
Comment réduire la taille d'un fichier - Guide
Input signal out of range ✓ - Forum Matériel & Système
Taille 32x32 correspondance ✓ - Forum Loisirs / Divertissements
Reduire taille photo - Guide
Comment désactiver out of range - Forum Ecran

12 réponses

Réponse 1 / 12

Meilleure réponse

La meilleure réponse est la réponse qui a été validée par nos équipes.

gryzzly Messages postés 4608 Date d'inscription Statut Contributeur Dernière intervention 1 335

attribut "size" https://www.w3schools.com/tags/tag_input.asp

Réponse 2 / 12

Helvetti

Mais oui, s'il n'y avait pas de posts comme ça, on ne trouverait justement rien sur Google ...
Je viens de trouver ce post en tapant "html taille input", et qui répond à la même question que je me posais !
Alors merci à toi de poser cette question sur ce forum ^^

blackcat

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<link rel ="stylesheet" href ="CssPage1/Style_formulaires.css"/>
</head>
<body>
<form method="post" action="fichier.php">

	<p>
		<label for="nom">
			Pseudo
		</label>
		<input type="text" name="nom" id="nom" autofocus maxlength="5" size="10" />
		
		
		
	</p>
</form>

	



</body>
</html>

Réponse 3 / 12

Ulyce82

Voili voilou: <input type="texte" name="blablabla" style="width:200;height:200;"/>

Ne pas oublier l'unité de mesure : px

donc la bonne réponse serait :

<input type="texte" name="blablabla" style="width:200px; height:200px;"/>

Réponse 4 / 12

garf

utilise "font-size" dans ton style css

.style_input{
width:200px;
height:20px;
font-size:14px;
}

<input type="text" class="style_input" value="mon texte" />

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question

Réponse 5 / 12

gryzzly Messages postés 4608 Date d'inscription Statut Contributeur Dernière intervention 1 335

Sauf que si tu ne précises pas d'attribut size (comme je l'ai indiqué il y a déjà 2 ans ...), un navigateur texte affichera un input de 0 ou 1 caractère ... raté pour l'accessibilité du formulaire !
width, certes .. mais pas seulement.

Et en tout cas, à éviter les styles embarqués.

Il vaut mieux une feuille de style externe :

input[type="text"] {
    width:(x)px/%/em;
}

Réponse 6 / 12

Mr_SATAN

Salut et merci à ceux qui ont donné des explications :)
J'ai une petite question subsidiaire si quelqu'un passe par là : j'ai bien réduit les champs input mais le texte à l'intérieur a toujours une taille par défaut et se retrouve donc coupé. Comment faire pour que la taille du texte soit proportionnelle à la hauteur du champ ?

Réponse 7 / 12

Garth

C'est bien le css pour définir une taille.
Quid de pouvoir limiter le nombre de caractères? Je vient d'essayer l'attribut size mais dans mon firefox ça permet quand même de mettre 5 caractères et si l'on en rajoute au delà ça décale le texte dans le champ...
Voici:

heure <input type="text" size="2" name="heure" />

Et la même pour des minutes donc ça risque pas que le visiteur veuille indiquer qu'il est 127 heures 223minutes...
Une idée pour restreindre? Enfin en HTML, pas du javascript qui calculerais la largeur du champ(j'ai essayé d'ajouter cols="2" mais marche pas non plus).

Testé uniquement dans firefox, pour les autres je verrait après.

Immobook.wix.com/belgique

<label>Heure :</label>
<input type="text" size="2" name="heure" maxlength="12" />

Je suis novice mais je pense que cela doit être bon !!

Bon le sujet date, mais pour celui qui cherchera ;)

A+

Beniboy

telliak Messages postés 3668 Date d'inscription Statut Membre Dernière intervention 881 > Immobook.wix.com/belgique

Ne pas hésiter à lire les réponses précédentes pour éviter une exhumation inutile...

Réponse 8 / 12

Kiba

Mah non il aide les gens qui googuelisent ^^ lien sympa merci bien :)

Réponse 9 / 12

Mr_SATAN

Merci pour ta réponse rapide :)

J'ai pensé à essayé ça mais ça ne fonctionne pas tout à fait. J'arrive effectivement à réduire le texte mais dans tous les cas il est coupé :

Capture d'écran : http://greg.santana.free.fr/images/Clipboard02.jpg

J'ai essayé les iinstructions "margin-top", "padding-top", "vertical-align" mais rien ne fonctionne

Réponse 10 / 12

ptitdav80 Messages postés 18 Date d'inscription Statut Membre Dernière intervention 5

Bonjour à tous,

je relance le sujet... :)

Pour ma part ça fonctionne très bien avec du CSS sur tous les navigateurs, sauf IE...... (pour changer :D )

Voici la page en question : www.david-b.net/contact.php

Voici mon CSS :

.milieu input[type=text]{
border:none;
background-color:white;
width:300px;
height:16px;
color:black;
font-size:11px;
}

Quelqu'un pourrait m'aider? (ou alors m'aider à faire disparaître ce maudit navigateur ^^)
Merci d'avance :)

Jeannot

Bonjour

IE6 ne gere pas les sélecteurs d'attributs ( input[type=text] ). Je crois que les versions supérieures les prennent en compte, mais je ne suis pas certain de ca, à vérifier...

Le bloc css est ignoré.

La seule solution est de créer une classe et de l'appliquer a tous tes input text (c'est largement plus long, moins joli, mais bon) :

.milieu .input_text{
...
}

<input type="text" class="input_text" ...>

unami

merci

Réponse 11 / 12

Utilisateur anonyme

lu

Met google en page par defaut tu verra c'est pratique

car en tapant "html input" dans google on a la réponse, alors soit tu ne sais pas utilsier google comme bcp de personnes soit tu es parresseu.

Réponse 12 / 12

Utilisateur anonyme

on trouve rien sur google.... c'est sur il y a peu de site qui répertorie les parametres html php etc..

https://www.google.fr/search?hl=fr&q=html+taille+input&btnG=Recherche+Google&meta=&gws_rd=ssl

+

-1

Vinci Nou

Oula vieux message que je ressors, en esperant que sa aide les futurs chercheurs googlelistes:

Donc pour la taille d'un Input ... rien de plus simple: Le css!(en meme temps le CSS marche sur tt se qui bouge et c lui qui sauveras le monde de cette infame javascript xD je déconne)

Voili voilou: <input type="texte" name="blablabla" style="width:200;height:200;"/>

manio

pour la langueur du rectangle : <input ......... size="10" ........./>

pour determiner la langueur maximum de text <input ........... maxlength="7" ........./>

Garth

Merci Manio je vient de trouver, aussi comme le post est bien référencé je met la réponse en html (ça aideras les paresseux et ceux qui savent pas utiliser Google)

MAXLENGTH limite le nombre de caractères max
heure <input type="text" MAXLENGTH="2" name="heure" />

Répondre Posez votre question

Votre réponse

Discussions similaires

Changer la taille d'un seule input

ProgProject -
jordane45 -

1 réponse

Ajustement automatique taille de la page

52322 -
sevrain90130 -

39 réponses

HTML - définir taille bouton

Diva -
Utilisateur anonyme -

14 réponses

Comment redimensionner des images via HTML ?

gro -
Sniper25 -

12 réponses

html : taille d'un bouton

Claire -
Stéphane -

4 réponses

comment agrandir une image en css

Lili_754 -
Lili_754 -

3 réponses

Devenez membre en quelques clics

Connectez-vous simplement avec ceux qui partagent vos intérêts
Suivez vos discussions facilement et obtenez plus de réponses
Mettez en avant votre expertise et aidez les autres membres
Profitez de nombreuses fonctionnalités supplémentaires en vous inscrivant

S'inscrire