Android上的Chrome 55.0.2883.91是否正确缩放固定元素?
我不确定,但我认为Chrome for Andoird开始在固定元素上缩放,而这些元素在缩放时不再破坏页面/布局 请在运行最新Chrome for Android(在移动设备上)的本地开发环境中检查此简单设置 当我缩放包含此元标记的页面时Android上的Chrome 55.0.2883.91是否正确缩放固定元素?,android,html,css,google-chrome,css-position,Android,Html,Css,Google Chrome,Css Position,我不确定,但我认为Chrome for Andoird开始在固定元素上缩放,而这些元素在缩放时不再破坏页面/布局 请在运行最新Chrome for Android(在移动设备上)的本地开发环境中检查此简单设置 当我缩放包含此元标记的页面时 <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes"> <div class="fixed-placeholder"&g
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes">
<div class="fixed-placeholder">
<div class="site-header">
Site Header
</div>
<div class="menu-icon">
Menu
</div>
</div>
<div class="content">
Content
</div>
<div class="content">
Content
</div>
<div class="content">
Content
</div>
<div class="content">
Content
</div>
.fixed-placeholder {
height: 6em;
display: block;
}
.site-header {
position: fixed;
height: 3em; /* same as fixed-placeholder to avoid page jump or content moving under the fixed element */
top: 0;
left: 0;
width: 60%;
background-color: #ccc;
font-size: 2rem;
/*width: 80vw;*/
/*display: none;*/
}
.menu-icon {
position: fixed;
height: 3em;
top: 0;
right: 0;
border: 1px solid black;
width: 40%;
font-size: 2rem;
/*width: 20vw;*/
}
.content {
height: 500px;
border: 1px solid green;
}