HTML5

iOS6でinputタグに幅100%とプレースフォルダを設定した時のバグ

More than 5 years have passed since last update.

バグ

inputタグに'width: 100%;' と 'placeholder' を同時に設定した状態で、
デバイスを横から縦に傾きを変えると親の幅が横向き時の状態から戻らなくなるバグがありました。

<div>
<input type="text" name="searchParam" value="" placeholder="テキストを入力" />
</div>
input[type="text"]{
width: 100%;
box-sizing: border-box;
}

対処

親要素に'overflow: hidden;'を設定する

div{
overflow: hidden;
}