レスポンシブでmax-widthは390pxです。
.header_innerにposition:fixedをかけると横幅が右にはみ出してしまいます。
(fixedをかける前は収まっていた)
更にスクロール時に要素全体が固定されず半分になってしまいます。
(上に少し移動してしまう)
レスポンシブの確認方法はGooglecharmの検証ツールを使っています。
下記レスポンシブのcssです。
ご教授いただけますと幸いです。
html
<header>
<div class="header_inner>
<div class="header_container">
<div></div>
<div></div>
</div>
</div>
</header>
css
header .header_inner {
width: 100%;
height: auto;
padding: 2%;
background: #F1F0F5;
transition: 1s;
position: fixed;
top: 10px;
z-index: 999;
}
.header_container {
display: flex;
justify-content: space-between;
max-width: 390px;
margin: 0 auto;
}