I'm trying to create several marked images which will stretch out or shrink in, to match it's content's length. This works for every browser expect for any browser on iOS, such as iPhone and iPad.
See the image-link below to see how it is on iPad (upper marked image) and how it should be (and is on Windows and other browsers).
Anyone who knows a fix for this, or an explanation why this is only happening for iOS?
&:after {
content: '';
position: absolute;
top: -5px;
left: -10px;
width: 100%;
height: 47px;
z-index: -1;
background-size: 100% 47px;
@include bg-retina('~img/layout/block-subtitle-light-blue', 'png', 158px, 47px);
}