CSS

Tips

marginとpaddingの使い分け

それぞれの特徴

padding - 相殺が起こらない

なので、marginは極力使わないほうがいい

使う場合は単方向で

スクロールできないようにする

確認した限り殆どの環境で通用するはず。いろいろ調べた中で一番確実かと思われる。iOSも対応。

code: css

body.modal-open {

position: fixed;

left: 0;

right: 0;

top: 0;

bottom: 0;

}

code: js

let fixedScrollTop = 0;

export const fixedScroll = () => {

fixedScrollTop = document.body.scrollTop || document.documentElement.scrollTop || 0;

document.body.classList.add('modal-open');

document.body.style.top = -fixedScrollTop + 'px';

};

export const freeScroll() => {

document.body.style.top = '';

document.body.classList.remove('modal-open');

window.scrollTo({ top: fixedScrollTop });

};

pointer-events: none;

beforeとかをホバーさせたくない時用