inputタグの幅がコンテナからはみ出る問題の解決方法

inputタグに max-width: 100%; などと指定しても、コンテナからはみ出てしまうことがあります。その原因として、inputタグに size 属性が指定されている場合があります。

size 属性は、inputタグの見た目の幅を指定します。この値が指定されていると、そのサイズ分のスペースが確保されます。そのため、size="60"などと指定されていると、指定した幅が確保され、コンテナからはみ出すことがあります。

これを解決するためには、size 属性を空にすると良いです。具体的には、size=""とします。これにより、size 属性が指定されていないものとして扱われ、max-width: 100%; などのスタイルが適用されます。

<input size="" />

コメントする

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

上部へスクロール