如何实现宽度小于窗口的列表视图？

Question

我正在使用jquery mobile。我想在这张图片中显示列表视图。你能建议我最好的方法来实现这个列表视图（宽度小于窗口宽度）吗？

这是我的小提琴 http://jsfiddle.net/Palestinian/bNJt5/

<div data-role="page" id="foo">
    <div data-role="header" style="background: green;">
            <h1>Wbservice</h1>

    </div>
    <!-- /header -->
    <div data-role="content"></div>
    <!--pop up screen-->
    <div data-role="popup" id="webservice" data-close-btn="none">
        <div data-role="header" style="background: green;">
             <h1>Wbservice new/edit</h1>

        </div>
        <div data-role="content">
            <input name="webserviceName" value="" type="text" autocapitalize="off" placeholder="Name the web Service" />
            <input name="Address" value="" type="text" autocapitalize="off" placeholder="Address of webservice" />
            <div class="tooltip_arrow"></div>
        </div>
    </div>
    <!-- /content -->
    <div class="customFooter" data-role="footer">
        <img src="http://placehold.it/42x42" id="Test" />
        <img src="http://placehold.it/42x42" />
         <h4>Page Footer</h4>

    </div>
    <!-- /header -->
</div>
<!-- /page -->