対応ブラウザをIEからChromeに変更する時の注意点その1(textareaのリサイズ)
対応ブラウザをIEからChromeに変更する時の注意点について備忘録的に記載します。
発生問題点
textareaがリサイズできてしまう。
環境
-
OSはWindows10
- バージョン:1803(OSビルド17134.407)
-
Microsoft Internet Explorer
- バージョン:11.407.17134.0
- 更新バージョン:11.0.95(BK4466536)
-
Google Chrome
- バージョン:76.0.3809.100(Official Build) (64ビット)
画面イメージ
IEでは以下のようにリサイズできなかった。
しかしChromeでは以下のようにリサイズでてきしまう。
ソース
1<html lang="ja">
2 <head>
3 <meta charset="utf-8">
4 <title>textareaのテスト</title>
5 <head/>
6 <body>
7 textarea<BR>
8 <textarea cols="40" rows="2" maxrow="2"></textarea>
9 </body>
10</html>
解決方法
textareaのstyleに明示的にresize:noneを指定する。
以下ソースの8行目に『style="resize:none;』を追加
ソース
1<html lang="ja">
2 <head>
3 <meta charset="utf-8">
4 <title>textareaのテスト</title>
5 <head/>
6 <body>
7 textarea<BR>
8 <textarea cols="40" rows="2" maxrow="2" style="resize:none;"></textarea>
9 </body>
10</html>