html - how to make the homepage responsive -
i'm newbie css
, want make responsive design mobile ie. "it appear blank page",but it's working in google chrome , other rest of browsers :-)
below codes that's used
html:
<div class="main"> <div class="container"> <div class="marquee"> <marquee scrollamount="3" direction="right" dir="ltr"> <h3 align="center" style="color:#804000;font-size:large;margin-top:0px;"><strong> <img height="37" src="http://www.ghadaalsamman.com/new/images/image21.png"> </strong></h3> </marquee> </div> <a class="button" id="btn1" href="http://ghadaalsamman.com/new/site.html"></a> </div> </div>
css:
html { height: 100%; width: 100%; } body { background-image: url("http://www.ghadaalsamman.com/new/images/bg.gif"); background-repeat: no-repeat; background-position: center center; height: 100%; margin: 0; } .marquee { display: block; position: absolute; top: 43%; width: 100%; } #btn1 { background-image: url("http://www.ghadaalsamman.com/new/images/enter.gif"); background-repeat: no-repeat; background-position: center center; bottom: 10px; display: block; height: 53px; margin: 0 auto; position: absolute; width: 100%; } .button { padding: 5px; } .container { display: block; height: 100%; margin: 0 auto; max-width: 960px; position: relative; } .main { height: 100%; padding: 0 20px; } @media screen , (max-width:500px) { #btn1{ background-size: 100% auto; } }
thanks in advance
work great me on windows phone 8.1
i don't think there issue responsiveness, checked on desktop resizing browser on ie , on windows phone.
Comments
Post a Comment