kingmoooon
New Member
I have created the project having Listview with default theme. My configuration goes as explained below.[*]index.html file where all the imports to css, js files are done including cordova-2.0.0.js and other stuffs that are needed. Index.html file contains my Login Page.[*]Now, After login I go to home.html page where i have list view configured as below :\[code\]<div data-role="header" data-theme="b"> <h1>Home Screen</h1></div><div data-role="content"> <ul data-role="listview" data-theme="c"> <li><a href="http://stackoverflow.com/questions/14079360/profile.html"><img src="http://stackoverflow.com/questions/14079360/images/profile.png" alt="Profile">My Profile</a></li> <li><a href="http://stackoverflow.com/questions/14079360/courses.html"><img src="http://stackoverflow.com/questions/14079360/images/courses.jpg" width="189" height="189" alt="Courses">My Courses</a></li> <li><a href="http://stackoverflow.com/questions/14079360/contactsList.html"><img src="http://stackoverflow.com/questions/14079360/images/contact.jpg" width="160" height="160" alt="Contacts">My Contacts</a></li> <li><a href="http://stackoverflow.com/questions/14079360/mapPage.html"><img src="http://stackoverflow.com/questions/14079360/images/map.png" width="215" height="215" alt="Map">My Map</a></li> </ul></div><div data-role="footer" data-theme="b"> <h4>© 2012.</h4></div>\[/code\]Note that I have not included the header file here. and only this much code is there in home.html file. (Note here since it is HTML i am not able show my Parent div tag where i have configured data-role="page")[*]Now, all the themes are getting applied only the arrow is not coming instead a Gray Spot is coming as in below Pic.
Can any one explain why it goes like this?? I have checked the other project and I have all the imports as it is.Below is my index.html imports :\[code\]<link rel="stylesheet" href="http://stackoverflow.com/questions/14079360/styles/custom.css" /><link rel="stylesheet" href="http://stackoverflow.com/questions/14079360/styles/jquery.mobile-1.2.0.min.css" /><script src="http://stackoverflow.com/questions/14079360/js/jquery-1.8.3.min.js"></script><!-- <script src="http://stackoverflow.com/questions/14079360/js/jquery-mobile-1.2.0.min.js"></script> --><script type="text/javascript" charset="utf-8" src="http://stackoverflow.com/questions/14079360/js/main.js"></script><script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script><script type="text/javascript" charset="utf-8" src="http://stackoverflow.com/questions/14079360/js/cordova-2.0.0.js"></script>\[/code\]EDITmy CSS custom.css goes as below\[code\]/* CSS Document */#container0 { width: 100%; height: 100%; position: relative; overflow-x:hidden; border: 1px solid black;}#div0 { width: 100%; height: 100%; position: absolute;}#div1 { width: 100%; position: absolute; left: 100%; height: 100%;}/*#footer { margin-top:'10px';}*/button { display:block; text-align:center; margin:0 auto; width:100%; height:2em;}.loginBtn { width:100%;}.info { border:1px solid black; background:#eeeeff; margin:5px; padding:5px;}/* Map CSS Start */html, body { height: 100%; margin: 0; padding: 0;}#map_canvas { width:520px; height: 900px;}/*@media print {*/@media all and (orientation: landscape) { html, body { height: auto; } #map_canvas { width: 950px; height: 480px; }}/* Map CSS End */.ui-content h2 { text-align:left; padding:0px; padding-left:10px; margin-bottom:10px;}.ui-content h4 { padding: 0px; padding-left:10px; margin-bottom: 5px;}\[/code\]