概要
SemiModalを利用した際にブラウザ間でデザイン差分が生まれているが、これは意図した挙動でしょうかという質問になります。
バージョン
0.62.1
具体的な内容
SemiModalのStoryでSemiModal内の.spui-SemiModal-contents要素を確認すると、以下のような差分が存在します。
Chrome
コンテンツの右側の余白が広い
Safari
コンテンツの右側の余白が広い
FireFox
コンテンツが幅いっぱいに表示されている
差分が生まれている理由
FireFoxはスクロールバーの領域を確保せず、Safari・Chromeはoverflowコンテンツの有無に関わらずスクロールバーの領域を確保するためこの差分が生まれていそうです。
Chromeでのスクロール可能状態
FireFoxでのスクロール可能状態
概要
SemiModalを利用した際にブラウザ間でデザイン差分が生まれているが、これは意図した挙動でしょうかという質問になります。
バージョン
0.62.1具体的な内容
SemiModalのStoryでSemiModal内の
.spui-SemiModal-contents要素を確認すると、以下のような差分が存在します。Chrome
コンテンツの右側の余白が広い
Safari
コンテンツの右側の余白が広い
FireFox
コンテンツが幅いっぱいに表示されている
差分が生まれている理由
FireFoxはスクロールバーの領域を確保せず、Safari・Chromeはoverflowコンテンツの有無に関わらずスクロールバーの領域を確保するためこの差分が生まれていそうです。
Chromeでのスクロール可能状態
FireFoxでのスクロール可能状態