Partage

Comment placer un curseur en haut de <input text>

21 avril 2017 à 10:34:50

bonjour,

j'ai un champ input de type text, que j agrandi avec mon css (d'une hauteur de 3 lignes).
Par default, le curseur se place sur la ligne central.

Est ce que qqn connaîtrait un moyen de ramener le curseur sur la ligne du haut?
(sachant que le css: "vertical-align:top;" ne semble pas marcher)

le code:
 html: 

<input type="text" name="Message" id="message" title="write message" autofocus ></input>

css: 

#message {
	width: 95%;
	height: 5em;
	background: transparent;
	color: white;
	border: 1px solid black;
	vertical-align:top;
}


merci d avance! 

-
Edité par TristanLefranc 21 avril 2017 à 10:35:53

21 avril 2017 à 14:18:07

salut

tu fait une erreur d’appréciation il n'y as pas 3 lignes mais bien une seule

et tu es donc dessus

met plutot un textarea

<textarea name="Message" id="message" title="write message" autofocus></textarea>

tu peux aussi rajouter dans ton css

 resize: none;

pour que l'on evite de le redimenssioner





22 avril 2017 à 10:29:26

Hello.

en fait je viens d'un textarea... Mais le souci c est qu un textarea ne permet pas, en appuyant sur "entrée", d envoyer automatiquement le message.(je fais un chat... Donc j aimerai qu on puisse envoyer des messages sans toucher a la souris).

pour ce qui est de javascript je ne connais pas le language, et pour avoir chercher un morceau de code tout fait, c est long de 25 lignes pour réaliser ca.

22 avril 2017 à 11:24:37

Hello,

Voici un exemple en JS -> https://jsfiddle.net/us76zzd2/1/ 

Par contre tu ne plus faire de retour de ligne dans ton texarea, un input de type "text" semble mieux adapté. Sinon revenir au bouton "submit".

A toi de voir...

-
Edité par Lucky13 22 avril 2017 à 11:25:41

24 avril 2017 à 12:44:39

hello, 
merci pour le tip.
en fait, j'ai trouvé la solution si un jour qqn a le meme souci que moi:
Si on agrandit un <input text> sur plusieurs ligne grace au css. Le curseur, reste au mileu, car il est marqué plus haut, la case est agrandie, mais <input text> resté composé d'une seule ligne de saisie.
en revanche, on peut également la faire bouger en utilisant un padding a l interieur de l input. 

merci a tous!

Comment placer un curseur en haut de <input text>

× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
  • Editeur
  • Markdown