MENU

Loading...

CSS

iOS Safariでfixedした要素のスクロールが出来ない場合の対処法

  • 公開日:
  • 投稿者: 杉谷 祐樹
ある要素を絶対位置指定で固定表示をすることを可能にするposition:fixed;というプロパティがあります。 ページ上に一枚レイヤーを重ねるような形で、メニューやモーダルなどのコンテンツを全画面表示させる場合などに用いられますが、その際にある条件を満たすと、iOSのSafariで絶対位置で指定した要素内をスクロール出来ない事象が発生してしまいます。 実案件でこの事象に遭遇したので、備忘録を兼ねて共有します。

続きを読む

CSSだけで背景写真のみを暗くする

  • 公開日:
  • 投稿者: 杉谷 知佳

背景画像を画面いっぱいに設定する際、上に乗る文字などを読みやすくするために背景画像を暗くすることがあると思いますが、写真を加工せずにCSSで暗くしようとしてopacityを使うと、中の要素に文字などを含めている場合、文字を含めた全体が暗くなってしまいます。

そこで、opacityを使わずに、内包する要素を含まずに背景画像のみをCSSで暗くする方法をご紹介します。

続きを読む