css - Samsung Android stock browser image not displaying -
i have responsive slider we've built handle product images. images of varying sizes - respect our target aspect ratio, there images don't both landscape , portrait.
the slider works everywhere apart on samsung devices in default android browser. experience common tablets , phones, samsungs. works fine on other android devices, litany of desktop browsers , ios.
the problem seems boil down height: 100%; on image used limit portrait images height of container. i've redacted our code down simplest version in jsfiddle below.
jsfiddle: https://jsfiddle.net/g453xstc/8/
ul { position: relative; /* height 0 , padding top maintain aspect ratio when resized */ height: 0; padding: 75% 0 0; } li { height: 100%; width: 100%; /* background demonstrate how far layout works on samsungs */ background: #eee; /* absolute positioning account height: 0 */ position: absolute; top: 0; left: 0; } img { height: 100%; /* offending line */ width: auto; }
Comments
Post a Comment