Un bouton sur 2 lignes

[francoisch]

bonjour

J'utilise des boutons classiques:

<input type="button" ...

auxquels j'ai accroché:

<!-- styles pour les boutons-->
<style>
input { width : 28ex; font-size : 14} 
</style>

Question: je voudrais que le texte, dans value=, apparaisse sur 2 lignes dans le bouton à l'affichage; comment faire?

J'ai inséré un <br> dans le texte mais ça ne fonctionne pas.

Par avance merci de votre aide.

Francois

[lzehnder]

Essaye comme ca :

<input type="button" value="ligne1,
ligne2">

[francoisch]

bonjour et merci de ta réponse.

J'ai ajouté une virgule dans le libellé de mon message:

 value="cahier, de soins"

mais ça n'a pas produit l'effet désiré.

Ma question demeure entière; merci par avance de votre aide.

Francois

[lzehnder]

C'est pas la virgule c'est le retour a la ligne apres

 value="cahier,
de soins"

[francoisch]

bonjour

J'ai bien fait un retour à la ligne au milieu de mon libellé de bouton:

<input type="button" name="lien11" value="cahier 
de soins"  onclick="affichesoins ()" ...

mais sans effet.

J'ai raté qqechose?

Francois

[lzehnder]

Bizarre quand je regarde cette page avec firefox ou IE j'ai bien un bouton a 2 lignes.

http://www.codevinfo.com/test/boutton.html

Modifié 15 Octobre 2007 par lzehnder

[Dudu]

Bonjour

J'utilise des boutons classiques:

<input type="button" ...

Ce n'est justement pas un bouton classique, puisqu'un bouton classique s'écrit <button> en HTML.

<!-- styles pour les boutons-->
<style>
input { width : 28ex; font-size : 14} 
</style>

La propriété CSS font-size doit OBLIGATOIREMENT avoir une valeur suivie d'une unité. Sans elle, tu es invalide. Et sur des navigateurs pointilleux (c'est-à-dire autres que Firefox ou Explorer qui sont très permissifs), tu peux t'attendre à des problèmes d'affichage dans l'état actuel des choses.

font-size: 14px serait déjà meilleur, si bien sûr tu t'exprimes en pixels.

NB: Il existe toutefois une exception pour lesquelles on ommetra l'unité dans font-size:

pour les valeurs non-numériques que sont inherit, xx-small, xx-large, x-small, x-large, small, large, larger, smaller et enfin default qui est la valeur par défaut.

J'ai inséré un <br> dans le texte mais ça ne fonctionne pas.

Et pour cause: <input> n'accepte AUCUNE balise enfant.

Et de toute façon, <input> est une balise de type "en-ligne". Or une balise "en-ligne" ne peut pas accepter d'élements de type "bloc".

Je pense que ta solution est dans le remplacement de la balise <input> par <button>.

Non seulement c'est plus indiqué sur un plan sémantique, comme je le disais en début de message. Mais cette balise accepte <br> comme balise enfant: ce sera alors simplissime d'obtenir un texte de plusieurs lignes.

Pour finir, <button> se stylise en CSS de la même manière qu' <input>.

Bizarre quand je regarde cette page avec firefox ou IE j'ai bien un bouton a 2 lignes.

http://www.codevinfo.com/test/boutton.html

Effectivement, c'est bizarre comme tu dis.

Ta balise <input n'est pas fermée. Dur dans ces conditions d'obtenir un bon affichage sur toutes les plates-formes.

Que cela passe dans Firefox ou Explorer est donc en effet "bizarre". Quoique ta page étant sans Doctype tu passes en mode permissif (quirks mode).

Bref, sur des navigateurs tels qu'Opera, Safari, et autres navigateurs utilisant Webkit: ça ne passe pas

[francoisch]

bonjour et merci de vos réponses, Dudu en particulier.

J'ai modifié mes <input pour des <button, mis ce qu'il fallait sur 2 lignes et tout marche, c'est chouette.

Merci Dudu, merci à tous et à bientôt.

Francois