jQM grid in listitem

by Erik Zanker

HTML

<div data-role="page" id="page1">
    <div data-role="header">
         <h1>My page</h1> 
    </div>
    <div role="main" class="ui-content">
        <ul data-role="listview">
            <li>
                <div class="ui-grid-b">
                    <div class="ui-block-a">
                        <a href= "#anchor1"><img src="http://lorempixel.com/80/80/food/1/" /></a>
                    </div>
                    <div class="ui-block-b">
                        <a href= "#anchor1" class="ui-btn">Some text</a>
                    </div>
                    <div class="ui-block-c">
                        <a href= "#anchor1" class="ui-btn"> Delete</a>
                    </div>
                </div>
            </li>
           <li>
                <div class="ui-grid-b">
                    <div class="ui-block-a">
                        <a href= "#anchor1"><img src="http://lorempixel.com/80/80/food/2/" /></a>
                    </div>
                    <div class="ui-block-b">
                        <a href= "#anchor1" class="ui-btn">Some text</a>
                    </div>
                    <div class="ui-block-c">
                        <a href= "#anchor1" class="ui-btn"> Delete</a>
                    </div>
                </div>
            </li>           <li>
                <div class="ui-grid-b">
                    <div class="ui-block-a">
                        <a href= "#anchor1"><img src="http://lorempixel.com/80/80/food/3/" /></a>
                    </div>
                    <div class="ui-block-b">
                        <a href= "#anchor1" class="ui-btn">Some text</a>
                    </div>
                    <div class="ui-block-c">
                        <a href= "#anchor1" class="ui-btn"> Delete</a>
                    </div>
                </div>
            </li>                </div></li>

        </ul>
    </div>
    <div data-role="footer" data-position="fixed">
         <h1>Footer</h1> 
    </div>
</div>