Comment puis-je changer les colonnes de textarea dans twitter-bootstrap?

Si je change la valeur de: rows, cela fonctionne. Mais il rest aux valeurs par défaut quelle que soit la valeur que j’ai définie avec ‘: cols =>’. La largeur de la colonne ne changera pas.

J’ai consulté la source HTML et cela reflétait le changement. Je me demande si le CSS de bootstrap pourrait être le suspect …

HTML (il y a un “cols =” dans le HTML final, mais la largeur de la colonne rest à la valeur par défaut, qui est de 30. Je n’en crois pas mes yeux!)

 

Des rails:

  
5, :cols => 100 %>

Les autres réponses n’ont pas fonctionné pour moi. Cela a fait:

  

Document

Notez le span12 dans un div avec span6 .

MISE À JOUR: À partir de Bootstrap 3.0, les classes d’ input-* décrites ci-dessous pour définir la largeur des éléments d’entrée ont été supprimées. Utilisez plutôt les classes col-* pour définir la largeur des éléments d’entrée. Des exemples sont fournis dans la documentation .


Dans Bootstrap 2.3, vous utiliseriez les classes d’entrée pour définir la largeur.

       

Faites une recherche pour “Contrôle de la taille” pour des exemples dans la documentation .

Mais pour la hauteur, je pense que vous utiliseriez toujours l’atsortingbut rows.

Ajoutez simplement la classe bootstrap “row-fluid” à la zone de texte. Il s’étendra à 100% de largeur;

Mise à jour: Pour bootstrap 3.x, utilisez la classe “col-xs-12” pour textarea;

Mise à jour II: également si vous souhaitez étendre le conteneur à la largeur maximale: classe conteneur-fluide.

J’ai trouvé ce qui suit dans le site.css généré par VS2013

 /* Set width on the form input elements since they're 100% wide by default */ input, select, textarea { max-width: 280px; } 

Pour remplacer ce comportement dans un élément spécifique, ajoutez les éléments suivants …

  style="max-width: none;" 

Par exemple:

  

Je ne sais pas si c’est la bonne manière mais j’ai fait ceci:

 

et mettez ceci dans mon fichier bootstrapcustom.css:

 @media (min-width: 768px) { .textareawidth { width:500px; } } @media (max-width: 767px) { .textareawidth { } } 

De cette façon, il est redimensionné en fonction de la fenêtre d’affichage. Il semble que tout soit bien rangé sur un grand navigateur et sur un petit appareil mobile.

Cela fonctionne pour moi avec twitter bootstrap 2 et simple_form 2.0.4
Le résultat est une zone de texte span6 dans une ligne span9

  
< %= f.input :some_text, :input_html => {:rows => 5, :placeholder => "Enter some text.", :class => "span6"}%>

Une autre option consiste à séparer la zone de texte dans Site.css comme suit:

 /* Set width on the form input elements since they're 100% wide by default */ input, select { max-width: 280px; } textarea { /*max-width: 280px;*/ max-width: 500px; width: 280px; height: 200px; } 

aussi (dans mon MVC 5) append ref à textarea:

 @Html.TextAreaFor(model => ................... @class = "form-control", @id="textarea"............ 

Ça a fonctionné pour moi