ユーザーが要素のサイズを変更できるかどうかを指定するプロパティです。none、both、horizontal、verticalの値があり、textareaのリサイズ動作を制御できます。
resize: none | both | horizontal | vertical| resize | resize: both |
| resize-y | resize: vertical |
| resize-none | resize: none |
resize: vertical;縦方向のみリサイズ可能(textareaのデフォルト)
resize: horizontal;横方向のみリサイズ可能
resize: both;縦横両方向にリサイズ可能
resize: none;リサイズ不可
textareaのリサイズを制御する際によく使う。overflowが visible 以外である必要がある。
overflow: visible;では効果がない。overflow: auto;やhidden;などと組み合わせる。
resizeはoverflowがvisible以外の要素にしか効きません——この前提条件をAIは省略しがちです。またtextareaの自動サイズ調整(内容に応じて伸びる)はresizeではなくfield-sizing: contentの領域で、手動リサイズと自動リサイズの区別が必要です。方向はboth/horizontal/verticalを選べます。
チャット欄のtextareaを「手動リサイズは縦のみ許可、内容でも自動で伸びる」ようにresizeとfield-sizingで設計して
そのままAIチャットに貼り付けて使える依頼文の例です。ページ上部の「AI用にコピー」でこのページ全体をコンテキストとして渡せます。