2017 May 14

レスポンシブWEBサイト製作の際にお世話になっている、safari専用のハックコード。

@media screen and (-webkit-min-device-pixel-ratio:0) {
::i-block-chrome, .box_bg_photo {
height: 600px; /*縦幅*/
}
}

こんな感じの分ですね。もう有名なコードですが(・ω・`)

今現在のiPhone7、iPadpro環境の新しいSafariには効かなかったので、ぐぐーる先生に相談したところ新しいハックコードを紹介しているブログサイトさんをみつけたので、メモメモッ

それがこちら(´・ω・`)ノ

_::-webkit-full-page-media, _:future, :root .box_bg_photo {
height: 600px; /*縦幅*/
}

ただ、古いSafariだとこのコード反応しなかったので...(;°ロ°)

二つ書かないといけなくなったのか..._| ̄|○


◎参考サイト様
SublimeなLife日記さま
//sublimelife.hatenablog.com/entry/2017/02/06/102109

TrackBack

このエントリーのトラックバックURL; //m-drive.me/mtw/cgi-bin/mt4/mt-tb.cgi/1105
このエントリーのリンクURL: //m-drive.me/mtw/blog/diary/html/2017/05/14-2112.php

Comment


Warning: include(/home/users/1/cocotte.jp-mtw/web/includes_c/amazoolink.php): failed to open stream: No such file or directory in /home/mdrive/m-drive.me/public_html/mtw/blog/diary/html/2017/05/14-2112.php on line 384

Warning: include(): Failed opening '/home/users/1/cocotte.jp-mtw/web/includes_c/amazoolink.php' for inclusion (include_path='.:/opt/php-7.2.17/data/pear') in /home/mdrive/m-drive.me/public_html/mtw/blog/diary/html/2017/05/14-2112.php on line 384