motoori
仕事も趣味も全力で楽しむ

iPadなどのタブレットでのheight(vh)が
PCブラウザとずれる現象の対策

2020.03.01 2019.07.05
  1. 結論
    1. 原因
    2. 参考

結論

CSSStyleDeclaration.setProperty()を使用してvhを再定義する

原因

タブレットなどではvhの高さにメニューバーの高さも含まれてしまうため。

参考

CSSStyleDeclaration.setProperty()

備忘録
CSS JavaScript
シェアする
Twitter Facebook はてブ LINE コピー
mogataro
motoori

関連記事

備忘録

Vue.js 3.0で導入予定のCompositionApi について

※この記事は2020年2月22日に試したものです。現在はVue3.0リリースされています。 Vue.js 3.0の主要な変更点 Composition API 仮想DOMの書き換えパフォーマンスの向上 TypeScriptサポ...
備忘録

WAI-AREA属性についてのリンク集

ARIA を使用する: ロール、ステート、プロパティ WAI-ARIA Cheat Sheet
備忘録

スプレッドシートでシート名から日付を取得する

結論 GASでシート名を取得する関数を作成し、シート名から日付を取得する まず、スプレッドシートにて、ツール->スクリプトエディタをクリックして開き、SHEETNAME()という関数を作成するため、以下のコードを記載する。 func...
備忘録

Laravelの.htaccessファイルについて

.htaccessはドットエイチティーアクセスって読む。 publicフォルダに以下の.htaccessをおく ほぼ理解できていないのですが、リダイレクトの設定をしているみたいです。 これを置いていなかったため、index以外のページ...
備忘録

Nuxt.jsでPugを使用する

pug-plain-loaderをインストールする $ npm install --save-dev pug@2.0.3 pug-plain-loader coffeescript coffee-loader node-sass sass-...
備忘録

擬似クラス、擬似要素まとめ

シンプルセレクタ ダイナミック擬似クラス(リンク擬似クラス) :link リンク先に未アクセスの要素 :visited リンク先にアクセス済要素 ダイナミック擬似クラス(ユーザアクション擬似クラス) :hover カーソルを重...
Laravelの.htaccessファイルについて
nuxtでvue2-highchartsを使って折れ線グラフを描写してみた
ホーム
備忘録

人気記事

PMBOK入門6章 テスト・移行フェーズ
2021.10.012021.12.03
vueのイベントハンドラ(v-on)
2019.06.30
【React】vueのv-htmlに該当するもの
2019.07.162020.03.01
要素を見えないようにするが、スクリーンリーダーには読ませるcss
2021.10.282024.08.26
Laravelの.htaccessファイルについて
2019.07.022020.03.01

外部リンク

  • GitHub
  • Portfolio2019

タグ別記事一覧

  • php
    • laravel
  • javascript
    • react
    • vue
    • nuxt
  • html
  • css
  • mysql

カテゴリ別記事一覧

  • 備忘録58
  • 雑記9
スポンサーリンク
この記事を書いた人
mogataro

WEBエンジニアです。
サーバーサイドエンジニアからフロントエンドエンジニアになりました。

mogataroをフォローする
スポンサーリンク
motoori
© 2019 motoori.