Monday, 15 September 2014

css3 - background-size: cover not working in portrait on Android tablet -



css3 - background-size: cover not working in portrait on Android tablet -

i'm using background-size property total width , height background image having problem getting cover in chrome on nexus7 tablet in portrait view. covers width , not height i.e. there 200px of white space below it. when view site in desktop chrome (or else) , on vertical monitor emulate portrait dimensions covers no problem.

anyone have solution?

css:

html { background: url(/images/post_bg.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; -ms-filter: "progid:dximagetransform.microsoft.alphaimageloader(src='/images/post_bg.jpg', sizingmethod='scale')"; }

portrait screen shot:

i believe can prepare defining height of html , body tags in css, so:

html{ height:100%; min-height:100%; } body{ min-height:100%; }

hope helps

android css3 google-chrome cover background-size

No comments:

Post a Comment