• はてなブックマーク
  • テクノロジー
  • iOSでも100vhをいい具合に調整して画面の高さいっぱいに要素を表示させる
  • Twitterでシェア
  • Facebookでシェア

iOSでも100vhをいい具合に調整して画面の高さいっぱいに要素を表示させる

テクノロジー カテゴリーの変更を依頼 記事元:zenn.dev/tak_dcxi
適切な情報に変更
323users がブックマーク コメント 23

    記事へのコメント23件

    • 注目コメント
    • 新着コメント
    cacacactus
    css解釈コロコロ変えるのがクソなのはそれはそうなんだけどヒーローエリアを100vhどーんが必要なサイトって本当はそんなにないのではと思う。大体は自己満で終わってる。

    その他
    diveintounlimit
    このネタつい最近コリスで見たとこだ

    その他
    ichi404
    無理矢理height設定しなくてもflexのcolumnで解決する事ちょいちょいある

    その他
    ttkazuma
    かれこれ20年は同じようなことを繰り返してる

    その他
    arapro
    chromeはほんとcss解釈をコロコロコロコロ変えるよな…

    その他
    hamaco
    “CSS変数はJavaScriptやメディアクエリで値を変えられるのでとても便利”しらんかった…。

    その他
    Dragoonriders
    画面回転は誰が管理すべきものか、アドレスバー表示は誰のものか、どちらもユーザーのものだろう。そう考えずにクライアントの言いなりに作り込むのは「デザイン」による押しつけだろうな。

    その他
    gaku_ds
    もう飽きた。でも止まれないんだよね

    その他
    boxshiitake
    iOSめんどくせ

    その他
    cacacactus
    cacacactus css解釈コロコロ変えるのがクソなのはそれはそうなんだけどヒーローエリアを100vhどーんが必要なサイトって本当はそんなにないのではと思う。大体は自己満で終わってる。

    2020/10/04 リンク

    その他
    otchy210
    100vh の話より、こっちの方が有用な情報だった。知らなかったよ。これクソ便利では？→ "CSS変数はJavaScriptやメディアクエリで値を変えられるのでとても便利"

    その他
    flirt774
    chromeがどうと言ってる人は内容見てない。Safari(iOS)の独自仕様でしょ

    その他
    circled
    chrome is new IE

    その他
    nicht-sein
    というか、これはIE滅びろ案件ではなくvhにアドレスバーを考慮しないSafari修正しろ案件なのでは疑惑。最近はSafariが非対応っていうのが増えてきた気がする。いや、Google先走り過ぎも否定できないけどねｗ

    その他
    poponponpon
    resizeはaddEventListenerよりアレでやったほうがいいんじゃないかな、あのあれ名前忘れたけどアレよ

    その他
    buhoho
    自分のサイトは7割iPhoneユーザーだけど、手元にiOSに無いからスタイルどうなってるのか正直わからないな。伝統的なWebレイアウトにしときゃ大丈夫だろう精神

    その他
    ttkazuma
    ttkazuma かれこれ20年は同じようなことを繰り返してる

    2020/10/04 リンク

    その他
    primedesignworks
    Francfranc に置いてあるサンプル表示用のパソコンのブラウザを見る度に、「Chrome がシェアトップになる日が現実になり、IE がシェアトップという地獄から抜け出せて感謝してる」と心から思ってる。

    その他
    diveintounlimit
    diveintounlimit このネタつい最近コリスで見たとこだ

    2020/10/04 リンク

    その他
    k3akinori
    またiOS Safariか

    その他
    ichi404
    ichi404 無理矢理height設定しなくてもflexのcolumnで解決する事ちょいちょいある

    2020/10/04 リンク

    その他
    mayumayu_nimolove
    そういうのちゃちゃってやってくれるライブラリとかないの？

    その他
    cartman0
    正直従来のウェブアクセシビリティのようにスクロール頼ったほうが早いのよな

    その他
    AzuLitchi
    見出しに「〜問題」とか「〜の件」とか入れてるのを見ると鳥肌立つほど寒いので気をつけようと思った。

    その他
    gachapining
    "-webkit-touch-callout" このハックは Chrome が対応した瞬間に崩れるからなぁ

    その他
    kvx
    使う場所が限定されないし、IEは100vhになるし、かなりいい方法かも。100vwにスクロールバー含まれる問題もどうにかできないかなぁ。/勘違いしてる人いるけど—vhはブラウザ仕様に影響受けない方法でしょ？

    その他
    arapro
    arapro chromeはほんとcss解釈をコロコロコロコロ変えるよな…

    2020/10/04 リンク

    その他
    d4-1977
    100vhというか、vhの上手い使い方がまだまだわからない…

    その他

    注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています

    アプリのスクリーンショット
    いまの話題をアプリでチェック！
    • バナー広告なし
    • ミュート機能あり
    • ダークモード搭載
    アプリをダウンロード

    関連記事

    iOSでも100vhをいい具合に調整して画面の高さいっぱいに要素を表示させる

    TAK(@tak_dcxi)です。今回もCSSに関する投稿です。 以前このようなツイートをしました。 メインビジュア...

    ブックマークしたユーザー

    • techtech05212024/04/07 techtech0521
    • hg_kosuke2022/06/24 hg_kosuke
    • sig2022/04/05 sig
    • noguful2022/01/19 noguful
    • Kmusiclife2022/01/16 Kmusiclife
    • pageru2021/10/28 pageru
    • okyawa2021/10/12 okyawa
    • sutetuki2021/10/02 sutetuki
    • mimosafa2021/08/20 mimosafa
    • utgwkk2021/07/28 utgwkk
    • team-chan32021/06/10 team-chan3
    • KisstBnts2021/05/06 KisstBnts
    • wangeru2021/04/13 wangeru
    • Lhankor_Mhy2021/03/22 Lhankor_Mhy
    • klim08242021/03/01 klim0824
    • karur4n2021/02/26 karur4n
    • Arahabica2021/02/11 Arahabica
    • clea00002021/02/08 clea0000
    すべてのユーザーの
    詳細を表示します

    同じサイトの新着

    同じサイトの新着をもっと読む

    いま人気の記事

    いま人気の記事をもっと読む

    いま人気の記事 - テクノロジー

    いま人気の記事 - テクノロジーをもっと読む

    新着記事 - テクノロジー

    新着記事 - テクノロジーをもっと読む

    同時期にブックマークされた記事

    いま人気の記事 - 企業メディア

    企業メディアをもっと読む

    はてなブックマーク

    公式Twitter

    はてなのサービス

    • App Storeからダウンロード
    • Google Playで手に入れよう
    Copyright © 2005-2025 Hatena. All Rights Reserved.