Double scroll bars when using the Panels of jQuery Mobile 1.3 in ASP.NET MVC 4

Question

I cannot figure this out. Once I put the following code in the layout page and view it in a browser I'm showing 2 vertical scroll bars.

<div data-role="panel" 
     id="mypanel" 
     data-position="right" 
     data-display="push" 
     data-theme="a">       
</div><!-- /panel -->

Answer 1

Was having a similar problem and noticed that was only when using my custom theme. I was adding my custom theme on the wrong order to the page and that was causing the problem. The right order is:

jquery.mobile.CUSTOM.min.css
jquery.mobile.structure-1.3.1.min.css

Hope this helps someone else also.

As mentioned by @user812775 if you are using a custom theme you should only use the jquery.mobile.structure.css and not the full jquery.mobile.css

Answer 2

JQM Code adds "min-height: ..." so the solution is to override "min-height: to 0px.