dear friends,
I do not understand why I see the background image to fit to page with Chrome/Firefox on PC, while it does not fit on the default browser of a Galaxy Tab 3.
Please any help?
Thanky very much
<!DOCTYPE html><html><head> <link href="css/stili.css" rel="stylesheet" type="text/css"> <style type="text/css"> body {background-image: url('images/sfondo1.jpg')} @media screen and (orientation: portrait) { #menu {width:130px;font-size: 20px;} #menu li a {line-height: 44px;} .Titolo {font-size: 20px;margin-left: 130px;} .Contenuti {font-size: 20px;margin-left: 130px;} .Riquadro {font-size: 20px;} } </style></head><body> <div class="Contenitore"> <div class="Contenuti"> testo..... </div> </div></body></html>
* { margin:0; border:0; padding:0;}html,body{ width:100%; height: 100%; background-color:transparent; color:rgb(0,0,0);}body{ background-repeat: no-repeat; background-position: 0 0; background-attachment:fixed ; -moz-background-size: cover; -webkit-background-size: cover; -o-background-size: cover; background-size: cover; z-index: 0;}.Contenitore{ width:100%; height: 100%; position:relative; top:0; left:0; overflow:auto; text-align:justify; z-index:10;}.Contenuti{ position:relative; font-family: Verdana, Geneva, sans-serif; font-size: 14px; padding-top: 30px; padding-bottom: 30px; padding-left: 30px; padding-right: 30px; margin-left: 100px; margin-right: 10%; background-color: rgba(255,255,255,0.6); box-shadow: 0px 0px 10px #2E2E2E; -webkit-box-shadow: 5px 5px 10px #333333; -moz-box-shadow: 5px 5px 10px #333333; overflow:auto;}