Working example: http://jsfiddle.net/Gajotres/nmZhz/2/
HTML :
<!-- Home -->
<div data-role="page" id="page1">
<div data-role="content">
<div class="ui-grid-a ui-responsive">
<div class="ui-block-a">
<ul data-role="listview" data-divider-theme="b" data-inset="false" id="custom-listview">
<li data-role="list-divider" role="heading">
Divider
</li>
<li data-theme="c">
<a href="#" data-transition="slide">
Button
</a>
</li>
<li data-theme="c">
<a href="#" data-transition="slide">
Button
</a>
</li>
<li data-theme="c">
<a href="#" data-transition="slide">
Button
</a>
</li>
</ul>
</div>
<div class="ui-block-b">
other content, which apear at tje left of the grid on large screens, and at the bottom on small screens
</div>
</div>
</div>
</div>
CSS :
#custom-listview {
margin: 0 !important;
}