PhoneGap JQuery Mobile Application - Overflow Issue
I am developing a PhoneGap application using JQuery Mobile.
I have header & footer NAVBAR's. And In the content section I have this HTML:
<div data-role="content" class="MainContent" style="overflow:hidden; padding-top: 0px;"> <ul data-divider-theme="b" data-role="listview" data-inset="true" class="MainMenu"> </ul> </div>
The List is dynamically created and works normally fine. However in some cases the overflow:hidden doesn't appear to be working and Header / Footer start moving along with the contents of the main body and become invisible.
Anyone has any idea please?
Adding data-tap-toggle="false" has worked for me. Thanks @NijilNair
Style is needed to remove extra space on the top.