object-fit:cover;がIE11で効かない場合の対処法です。手順としましては、 ofi.min.jsを読み込む JavascriptでobjectFitImages();を実行する object-fit:co […]

cssのtransform:translateでブロック要素を上下左右にセンタリングしたところ、IE11でなぜかスクロールバーが出る。 言葉にすると分かりづらいですが、下の画像のようにbody（青線部分）の中に配置したブ […]

CSSでテキスト入力ボックスやボタンを角丸にするのはよくやりますが、四隅全部ではなく部分的に角丸をする方法です。 たとえば下の画像では、テキストボックスは左側だけを、ボタンは右側だけを角丸にしています。 input[ty […]

フォームのテキストボックス（input type="text"）やボタン（input type="button"）を横一列で奇麗に並べようと思っても、表示させるブラウザによって位置がズレます。 本当は下の画像のようにした […]

inputタグのテキスト入力ボックス（input type="text"）やボタン（input type="button"）のデザインをCSSで作っても、そのままではiOSのiphoneやipadで効きません。 たとえば […]

フォームのテキスト入力欄（inupt type="text"）にフォーカスをあてた際に、下の画像のようにぼやっと表示されるブルーの枠線が邪魔なので、それを消す方法です。 :focus擬似クラスに、outline:0;を設 […]

buttonタグでボタンを作った際に、そのボタンをクリックすると下の画像のようにブルーのぼやっとした枠線が表示されます。 これがとても邪魔なので、それをCSSで消す方法です。 :focus擬似クラスにoutline:0; […]