Question

I have made a set of HTML5 pages using Jquery mobile. While developing I used Chrome, Safari & ripple emulator to see how my web pages were looking. I then put my pages on a local server and observed that in iPad & iPhone my pages were getting rendered properly but on Android browser the CSS effects would not work at all. All my jQuery mobile grids/themes went for a toss. Why would something like that happen?

I have used the Copy-and-Paste Snippets CDN hosted ‘.min’ files for my stylesheets and javascripts, haven’t downloaded them separately.

<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1,        target-densitydpi=device-dpi, user-scalable=no">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
<link rel="stylesheet" href="style1.css"  /> 
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>

Answer 1

It may be an incompatibility between the android browser and the CSS you are using. OS version of ur android browser?