CSS & Safari (iOS) - 溢出
[英]CSS & Safari (iOS) - overflow y
問題描述
由於 iOS 14，具有“溢出-y：滾動”屬性的 div 中的內容似乎不適用於 Safari，有人有解決方案嗎？ （也許只是我的代碼也不起作用。）
我不知道為什么它現在這樣做，我的手機上沒有調試工具（悲傷......）但它在 iOS 13.6 下工作。
我在下面舉了一個例子。
<html lang="fr">
<style>
html{
background-color: var(--background);
z-index: -9999;
}
body{
position: relative;
width: 100%;
top: 0;
left: 0;
right: 0;
margin: 0;
z-index: -9999;
}
.head{
position: relative;
display: block;
top: 0;
left: 0;
right: 0;
height: 10vh;
background-color: blue;
border-radius: 8px;
}
.emb-content{
margin-top: 2vh;
margin-bottom: 2vh;
width: 96%;
display: block;
margin-left: 2%;
margin-right: 2%;
border-radius: 10px;
height: 74.5vh;
overflow-y: scroll;
border: none;
z-index: 9999;
-webkit-appearance: none;
-webkit-box-shadow: 0px 2px 10px -1px rgba(0,0,0,0.45);
-moz-box-shadow: 0px 2px 10px -1px rgba(0,0,0,0.45);
box-shadow: 0px 2px 10px -1px rgba(0,0,0,0.45);
}
.footer{
display: block;
position: relative;
height: 10vh;
bottom: 0;
left: 0;
right: 0;
background-color: yellow;
}
</style>
<body>
<div class='head'></div>
<div class='emb-content'>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>add
</div>
<div class='footer'></div>
</body>
</html>
1 個解決方案
解決方案1
1 已采納 2020-09-19 14:26:46
刪除z-index：-9999； , z-index < 0 在 ios 14 中不受支持
溢出-y css 屬性導致右列中的內容在 Safari 上的某些 iPad 上消失
[英]overflow-y css property causes content in right column to disappear on some iPads on Safari
如果鼠標下的元素只有“溢出-y：滾動”並水平滾動，iOS Safari 似乎永遠不會觸發滾動事件
[英]iOS Safari appears to never fire scroll event if the element under mouse has only "overflow-y: scroll" and scrolling horizontally
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.