Note that there are some explanatory texts on larger screens.

plurals
  1. POhow to remove bottom space in windows phone phonegap?
    text
    copied!<p>I am developing a windows phone phonegap application, some space occurs under my first div itried lot of solution to over come this. but i did not get any solution. if u have any solution means please help me.</p> <pre><code>&lt;body onload="init()"&gt; &lt;div id="content"&gt; &lt;div class="title" align="center"&gt; &lt;span class="left"&gt; &lt;/span&gt; &lt;span class="center"&gt; &lt;img src="images/title.png"&gt; &lt;/span&gt; &lt;span class="right"&gt; &lt;a href="home.html" onclick="location.replace(this.href); return false;"&gt; &lt;img src="images/home.png"/&gt; &lt;/a&gt; &lt;/span&gt; &lt;/div&gt; &lt;div id="rapper"&gt; &lt;div id="scroller2"&gt; &lt;ul&gt; &lt;li id="ln" onclick="change_click(this.id)"&gt;&lt;div style="height:100%; width:100%;" &gt; LN&lt;/div&gt;&lt;/li&gt; &lt;li id="hn" onclick="change_click(this.id)"&gt;&lt;div style="height:100%; width:100%;"&gt; HN &lt;/div&gt;&lt;/li&gt; &lt;li id="kn" onclick="change_click(this.id)"&gt;&lt;div style="height:100%; width:100%;"&gt; KN&lt;/div&gt;&lt;/li&gt; &lt;li id="nn" onclick="change_click(this.id)"&gt;&lt;div style="height:100%; width:100%;"&gt; NN&lt;/div&gt;&lt;/li&gt; &lt;li id="wn" onclick="change_click(this.id)"&gt;&lt;div style="height:100%; width:100%;"&gt; WN &lt;/div&gt;&lt;/li&gt; &lt;li id="gn" onclick="change_click(this.id)"&gt;&lt;div style="height:100%; width:100%;"&gt; GN&lt;/div&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;/div&gt; &lt;div height="80%"&gt; &lt;div id="wrapper"&gt; &lt;div id="scroller"&gt; &lt;ul id="listcontent"&gt; &lt;/ul&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;div id="raper"&gt; &lt;div id="scroller3"&gt; &lt;ul id="pages"&gt; &lt;/ul&gt; &lt;/div&gt; &lt;/div&gt; &lt;div id="previouspage" style="text-align: center;" onclick="pagination(-1)"&gt; &lt;img height="100%" src="images/previous.png"/&gt; &lt;/div&gt; &lt;div id="nextpage" style="text-align: center;" onclick="pagination(1)"&gt; &lt;img height="100%" src="images/next.png"/&gt; &lt;/div&gt; &lt;/div&gt; &lt;/body&gt; </code></pre> <p>my css code </p> <pre><code> * { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } a { text-decoration: none; } html, body { margin: 0; padding: 0; border: 0; outline: 0; width:100%; height:100%; overflow: hidden; text-decoration: none; font-family:arial; } /*panel*/ #content { height:100%; width:100%; } /*title*/ .title { height:8.75%; border-bottom-color: #000; border-bottom-style: solid; border-bottom-width: 1%; } .title img { height:98%; } .title .center { height:100%; width:50%; float: left; } .title .right { height:100%; width:25%; float: left; margin:0 auto; overflow:hidden; } .title .left { height:100%; width:25%; float: left; margin:0 auto; overflow:hidden; } /*body*/ #inner { height:80%; width: 100%; float: left; } #header { height:12%; color:#000000; width: 100%; text-align:center; } #head { height:6%; color:#000000; width: 100%; padding-top:2%; text-align:center; } #heading { width: 100%; font-family: arial; background: #f00; color:#ffffff; text-align: center; align:center; } /*tiles*/ .vcard img { margin-left:10%; margin-right:10%; width: 80%; height:auto; display:block; background-repeat:no-repeat; background-size:100%; background-color:transparent; border:none; image-rendering: -webkit-optimize-contrast; } .vcard { width: 33%; height:auto; float: left; overflow:auto; } .card { width: 33%; height:33%; float: left; overflow:auto; } .space { height: 10%; text-align:center; } .primary { height: 20%; width:100%; } /*scroller*/ #wrapper { position: absolute; z-index: 1; top: 14%; bottom: 4%; left: 0; right: 0; width: 100%; overflow: hidden; } #Wraper { position: absolute; z-index: 0; top: 39%; bottom: 0PX; left: 0; right: 0; width: 100%; overflow: hidden; } #scroller { position: absolute; z-index: 1; -webkit-tap-highlight-color: rgba(0,0,0,0); width: 100%; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-text-size-adjust: none; -moz-text-size-adjust: none; -ms-text-size-adjust: none; -o-text-size-adjust: none; text-size-adjust: none; height: auto; } #loadmore { background:#ff0000; color:#ffffff; text-align:center; } #rapper { position: absolute; z-index: 1; top: 8.75%; bottom: 87%; left: 0; width: 100%; background: #000; overflow: hidden; font-family: arial; border-bottom-color: #000; border-bottom-style: solid; border-bottom-width: 1%; } #scroller2 { position: absolute; font-family: arial; z-index: 1; width: 188%; height: 100%; background-color: #a00; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-text-size-adjust: none; -moz-text-size-adjust: none; -ms-text-size-adjust: none; -o-text-size-adjust: none; text-size-adjust: none; } #scroller ul { list-style: none; padding: 0; margin: 0; width: auto; height: 100%; } #scroller2 ul { list-style: none; padding: 0; margin: 0; width: auto; height: 100%; background-color: #000000; text-align: center; } #scroller2 li { display: block; float: left; width: auto; padding:0% 3px 0% 3px; height: 100%; background-color: #000000; color:#ffffff; border:2px solid #000000; border-radius:5px; } #scroller3 { position: absolute; z-index: 1; width: 188%; height: 100%; background-color: #da1e15; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-text-size-adjust: none; -moz-text-size-adjust: none; -ms-text-size-adjust: none; -o-text-size-adjust: none; text-size-adjust: none; } #scroller3 ul { list-style: none; padding: 0; margin: 0; width: auto; height: 100%; text-align: center; } #raper { position: absolute; z-index: 1; top: 96%; bottom: 0%; left: 20%; width: 60%; background: #da1e15; overflow: hidden; visibility:hidden; } #previouspage { position: absolute; z-index: 1; top: 96%; bottom: 0%; left: 0%; width: 20%; background: #da1e15; border:2px solid #000000; visibility:hidden; } #nextpage { position: absolute; z-index: 1; top: 96%; bottom: 0%; left: 80%; width: 20%; background: #da1e15; border-bottom-color: #000; border-bottom-style: solid; border:2px solid #000000; visibility:hidden; } </code></pre> <p>the black portion mention that space</p> <p><img src="https://i.stack.imgur.com/3XMyn.png" alt="enter image description here"></p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload