MENUMENU
  • Home
  • Tags
  • Change Log
  • Sitemap
    • Front-end
    • Ruby on Rails
    • Zend Framework
  • Profile
  • Page Top
deadwood:
  • Home
  • >
  • HTML & CSS
  • >
  • HTML & CSS General
  • >
  • Mobile Browser 上で CSS で 100vh 指定するとアドレスバーの長さが追加されてしまう
HTML, JavaScript, jQuery

[HTML & CSS General] Mobile Browser 上で CSS で 100vh 指定するとアドレスバーの長さが追加されてしまう

公開日: 2019/10/07

memo.

100vh ではなく JavaScript でウィンドウの高さ innerHeight を取得して与える。

  • The trick to viewport units on mobile | CSS-Tricks
  • CSS 100vh is too tall on mobile due to browser UI – Stack Overflow
const heightSize = $("window").height();
$(".box-100vh").height(heightSize);

投稿ナビゲーション

« Previous Post
Next Post »

Profile

Profile image

独習したことをメモするWeb系Macのひと。
いろいろおしえてください。

このブログ記事は、公開日を基準に以下の macOS バージョンと対応しています。

  • 10.14 ... 2018/11/12 -

Profile »

Archives

Categories

  • Continuous Integration (1)
  • Document workflow (22)
  • Front-End (102)
    • Babel (9)
    • Front-End General (32)
    • Grunt & Yeoman (32)
    • npm & Bower (16)
    • webpack (13)
  • Git (44)
  • Google (27)
    • Android (4)
    • Chrome Developer Tools (3)
    • G Suite (2)
    • Google Analytics (1)
    • Google Apps Script (6)
    • Google Fonts (4)
    • Google General (5)
    • Google Maps (2)
  • HTML & CSS (108)
    • Bootstrap 3 (8)
    • Bootstrap 4 (6)
    • HTML & CSS General (69)
    • Sass & Compass (17)
    • Susy2 (8)
  • IDE & Editor (27)
  • JavaScript (79)
    • JavaScript General (31)
    • jQuery (39)
    • Node.js (4)
    • React (5)
  • macOS (88)
    • Automator & AppleScript (13)
    • macOS General (69)
    • MacPorts (6)
  • Middleman (33)
    • Middleman 3 (32)
    • Middleman 4 (1)
  • PHP (10)
  • Research (1)
  • RSpec 3 (6)
  • Ruby (56)
  • Ruby on Rails (61)
    • Ruby on Rails 4 (50)
    • Ruby on Rails 5 (11)
  • Server & Network (79)
    • AWS (1)
    • Docker (5)
    • Server & Network General (38)
    • Vagrant & VirtualBox (35)
  • Shell (17)
  • Tips (39)
  • Topics (13)
  • Windows (19)
    • Windows 10 (5)
    • Windows XP (14)
  • WordPress (101)
    • VCCW (10)
    • WordPress General (49)
    • WP Plugin (27)
    • WP Plugin Dev (5)
    • WP Theme Dev (10)
  • Zend Framework (61)
  • お知らせ (1)
  • 書評・読書メモ (4)
Copyright © d-wood.com