ビジネスアプリのちょっとしたコメント機能をやっています。各コメントは、クリックするとスパンになり、テキストエリアに変わります
問題は、テキストエリアがその中のテキストと同じ量のスペースを取ることです(編集していないときのスパンのように)
行がテキストと共に大きくなるソリューション (jQuery Autosize など) を見つけましたが、幅と高さの両方がテキストと共に大きくなるソリューションはありますか?
編集: 編集モードでは、マークアップは次のようになります (Knockout を使用すると、動的にレンダリングされた HTML は次のようになります。実際の KO HTML は異なります)。
<li>
<span style="display: none">This is a comment</span>
<textarea>This is a comment</textarea>
<span class="username">UserOne</span>
<span class="timestamp">Mars 26 '13</span>
</li>
edit2:これが唯一の解決策です:列をテキストエリアの最長の行に設定し、テキストエリアの最大幅を親の幅から兄弟の幅を差し引いた値に設定しますか? CSS や jQuery を使用して、すぐに使えるクリーンなソリューションはありませんか?