title: jQuery mobile 1.3 left slide panel - phonegap and fixed header
body: <p>I am using jQuery mobile 1.3 for my app in phonegap. I would like to implement the left slide menu like facebooks's app. I have fixed header with data-position="fixed". When I open the app in chrome it works. When I open the App in phonegap it doesn't works, because the fixed header is not moving to the right. </p>
  
  <p>Some solutions to fix this?</p>
  
  <p>EDIT:</p>
  
  <p>Here is very simple example code:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt; 
  &lt;html&gt; 
  &lt;head&gt; 
  &lt;title&gt;Page Title&lt;/title&gt; 
  &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt; 
  &lt;link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css" /&gt;
  &lt;script src="http://code.jquery.com/jquery-1.9.1.min.js"&gt;&lt;/script&gt;
  &lt;script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"&gt;&lt;/script&gt;
  &lt;style&gt;
  html, body { padding: 0; margin: 0; }
  html, .ui-mobile, .ui-mobile body {
      height: 435px;
  }
  .ui-mobile, .ui-mobile .ui-page {
      min-height: 435px;
  }
  .ui-content{
      padding:10px 15px 0px 15px;
  }
  .panel-content { padding:15px; }
  
  #myhdr.ui-panel-content-fixed-toolbar-position-left {
      border:1px solid red;
  }
  &lt;/style&gt;
  &lt;/head&gt; 
  &lt;body&gt;  
  &lt;div data-role="page" style="max-height:440px; min-height:440px;"&gt;
      &lt;!-- defaultpanel  --&gt;
      &lt;div data-role="panel" id="defaultpanel" data-theme="b"&gt;    
          &lt;div class="panel-content"&gt;
              &lt;ul data-theme="d" data-icon="false" data-divider-theme="d" data-inset="false" data-filter="true" data-filter-placeholder="keywords" data-role="listview" style="overflow:auto; height:200px;"&gt;
              &lt;li&gt;&lt;a data-rel="close"&gt;&lt;img src="images/icon.png" class="ui-li-icon" /&gt;close&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;&lt;!-- /content wrapper for padding --&gt;         
      &lt;/div&gt;&lt;!-- /defaultpanel --&gt;
      &lt;div data-role="header" data-position="fixed" id="myhdr"&gt;
          &lt;h1&gt;Panel Demo&lt;/h1&gt;
      &lt;/div&gt;
      &lt;div data-role="content"&gt; 
          &lt;a href="#defaultpanel" data-role="button" data-inline="true" data-icon="bars"&gt;Default panel&lt;/a&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I am working with Cordova 2.2.0, but I have tested it now with Cordova 2.9.0 and it is the same situation. Somehow the browser in Phonegap doesn't apply some style to the fixed header.</p>
  
  <p>Thanks
  Nik</p>