Textarea max-width

Je vais avoir des problèmes avec textarea max-width, j'en ai besoin pour ne pas dépasser .table-cell.deux largeur de redimensionnée, sur cet exemple:

JSfiddle exemple

HTML:

<div class="wrapper">
<div class="table">
    <div class="table-cell one">
        <p>small cell</p>
    </div>
    <div class="table-cell two">
        <p>textarea cell</p>
        <textarea></textarea>
    </div>
</div>

CSS:

textarea {
  max-width: 100%;
}

.wrapper {
  width: 500px;
}

.table {
  display: block;
  width: 100%;
}

.table-cell {
  display: table-cell;
  background: #E2D8C1;
  vertical-align: top;
  padding: 10px;
}

.table-cell.two {
  width: 100%;
  background: #DAC082;
}

.table textarea {
  max-width: 100%;
  width: 100%;
  height: 100px
}

S'il vous plaît ne vous conseillons pas d'utiliser javascript, besoin d'un pur css solution.

L'air parfait pour moi. Décrivez votre problème correctement, comment voulez-vous?
Désolé, lors d'un redimensionnement de textarea, j'en ai besoin pour redimensionner la hauteur, la largeur doit rester 100%

OriginalL'auteur no1lov3sme | 2015-01-14

  1. 49

    Utilisation:

    textarea { 
   /* will prevent resizing horizontally */
   resize:vertical;
}
    Ce n'est pas pris en charge dans IE/Edge et certains autres grands navigateurs: caniuse.com/#search=resize

    OriginalL'auteur Bhojendra Rauniyar

  2. 4

    J'ai ce problème aussi. La solution est très simple, mais je passe quelques heures pour des expériences... Utiliser ces deux paramètres en même temps dans le textarea élément de la classe/n ° d'élément de définition de style (90% 30% sont des exemples de valeurs) : 

    .textarea {
    width:90%;
    max-width:90%;
    max-height:30%;
}

    OriginalL'auteur user6297197

  3. 3

    Par défaut, la zone de texte est re importante. Si vous souhaitez augmenter la largeur de l'élément, vous pouvez le faire par

    HTML

    <textarea rows="4" cols="50">Content here</textarea>

    CSS

    max-width: 300px;
max-height:300px

    Démo sur jsfiddle

    Dans votre cas, vous voulez corriger la <textarea> taille lorsque le parent n'a pas une taille fixe.

    OriginalL'auteur Naveen - நவீன்

  4. 0

    Pour les textarea vous pouvez définir 

    <textarea rows="5"></textarea>

    et en css

    textarea { height: auto; }

    OriginalL'auteur AVM