如何将内容中的div扩展到比其内容更广泛？

Question

实施例。下面的代码表示为蓝盒，我想将2格扩展为黄格。但是，问题是;这个......需要在content内，但它总是左右边距。我不知道如何解决这个问题。

<div data-role="content" data-theme="d" >
        <div class="ui-grid-a" >
            <div class="ui-block-a"><strong>Time:</strong></div>
            <div class="ui-block-b" id="price-order-timestamp">yyyy-mm-dd hh24:mi:ss</div>
        </div>

        <div style="width:100%;"> <!-- Here-->
            <div class="ui-grid-d" id="data-table-header" >
                <div class="ui-block-a">Label A</div>
                <div class="ui-block-b">Label B</div>
                <div class="ui-block-c">Label C</div>
                <div class="ui-block-d">Label D</div>
                <div class="ui-block-e">Label E</div>
            </div>
            <div class="ui-grid-d" id="data-table" >
                <div class="ui-block-a">A</div>
                <div class="ui-block-b">B</div>
                <div class="ui-block-c">C</div>
                <div class="ui-block-d">D</div>
                <div class="ui-block-e">E</div>
            </div>
        </div>
    </div>

Answer 1

如果要删除添加到data-role=content标记的默认填充，请在custom.css中添加以下覆盖

#myPageId .ui-content{
    padding-left:0;
    padding​-right:0;
}​

http://jsfiddle.net/nirmaljpatel/LW5aC/