title: Jquery mobile header image and listview not sitting properly
body: <p>i created a header for my jquery website and filled the header with an orange colored image. I created a list view that I need to sit on top of the header orange image. Also I need the drop down menu items to drop down over the header image and not push the header image down as shown in the picture. Whats the code to achieve this<img src="https://i.stack.imgur.com/hblg9.png" alt="enter image description here">  </p>
  
  <pre><code>&lt;body&gt;
  &lt;div data-role="header" &gt;
  &lt;li class="custom-li"&gt;
  &lt;div data-role="collapsible" data-theme="b" data-content-theme="b" data-   collapsed-icon="bullets" data-expanded-icon="carat-u" &gt;
  &lt;h4&gt;Menu&lt;/h4&gt;
  &lt;ul data-role="listview"&gt;
  &lt;li&gt;&lt;a href="#"&gt;List item 1&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="#"&gt;List item 2&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="#"&gt;List item 3&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  &lt;/div&gt;
  &lt;/li&gt;
  &lt;img border="0" src="header1.jpg" width=100% /&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>