Discussion :

[TrexXx]

Bonjour à tous,

J'ai un petit problème avec la propriété contentEditable appliquée à un paragraphe.
J'ai ce code la en xHtml :

Code :

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

1
2
 
<p id="para" contentEditable="true"></p>

Et celui ci en CSS :

Code :

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

1
2
3
4
5
6
7
 
#para
{
    width: 400px;
    height: 150px;
    border: 1px solid black;
}

Or par défaut si on dépasse les limites du paragraphe avec le texte qu'on écrit ca augmente la taille du paragraphe. Moi je voudrais que quand on dépasse la largeur, ca fasse un retour à la ligne dans le paragraphe, comme dans un textarea. Et quand on dépasse en hauteur, ca ajoute une scrollbar, comme dans un textarea aussi.
Comment faire donc ?

Merci d'avance.

PS : Je sais pas si tout est très clair, demandé plus d'infos si besoin.

[Macmillenium]

Bonjour,

contentEditable est un attribut HTML5 (à l'état de brouillon) implémenté dans FF3+, Safari3+, Opéra9+ et IE5.5+.

Moi je voudrais que quand on dépasse la largeur, ca fasse un retour à la ligne dans le paragraphe, comme dans un textarea.

Ça dépend comment tu testes.
Si tu fait par exemple "dddddddddddddddddddddddddddd" c'est normal que le texte déborde.

Et quand on dépasse en hauteur, ca ajoute une scrollbar, comme dans un textarea aussi.

Il suffit d'attribuer un overflow:auto.

[TrexXx]

Oui je savais que c'était un attribut HTML5, mais bon je m'en sers juste pour faire un petit WYSIWYG perso, donc pas de problèmes de ce côté là.
En effet, j'avais testé que en faisant "ddddddddddd" sans faire d'espaces donc il me faisait une scrollbar en largeur, mais en mettant des espaces il va bien à la ligne et affiche bien une scollbar verticale si on dépasse en hauteur.
Merci pour la réponse