In% w / w the parameter iOS is shown halfway, on the PC it appears with 100% width normally.
How to make it appear with 100% width in iOS too?
ThisisSCSS:
.wrapper-masthead{border-top:7pxsolid$amarelo;background:$white;width:100%;top:0;left:0;position:fixed;z-index:100;@includemobile{position:inherit;}}Completecode: link
Possible issues:
1 - Element Width
width: 100%;
This measure is relative to the next (highest hierarchy) element that has declared width. If the next element is equal to% width, your child is 100% wide.
.pai{
width:50px;
}
.pai .filho{
width:100%; /* 50px */
}
2 - Viewport
Include a viewport on your page (if you do not have one) so you can more easily control the size of the elements and treat them with media-query precisely.
<meta name=viewport content="width=device-width, initial-scale=1, user-scalable=no">
3 - Position
@include mobile {
position: inherit;
}
This section is including the position of the element with the highest hierarchy that has declared position. Avoid putting it that way as there is more chance of some layout change changing the position of this element unexpectedly. Perhaps the best use in this case is position static which is the default property position:
@include mobile {
position: static;
}