在jquery mobile中的多个行和列的标题中正确对齐行

Question

我想在左侧（标题）正确对齐行，但我无法修复它。第一行是好的（带填充）但第二行（其中“开始”和“停止”按钮）是粘在左侧没有填充。我试图应用一个ui-bar，但填充比第一行宽。

http://jsfiddle.net/8jkdz8jf/6/

<div data-role="page" class="ui-responsive-panel" id="main">
    <div data-role="header" data-position="fixed">
        <div class="ui-grid-solo">
            <div class="ui-block-a">
                <h1 id="begin" class="ui-title" role="heading" aria-level="1">Test: <span id="title-hostname"></span>
                    [<span id="title-tester"></span>]
                </h1>
                <div class="ui-btn-left" data-role="controlgroup" data-type="horizontal">
                    <a href="#" onclick='btn_menupanel();' class="ui-btn ui-icon-bars ui-btn-icon-notext">Menu</a>
                    <a href="#" onclick='$("#infopanel").panel("open");' class="ui-btn ui-icon-info ui-btn-icon-notext">Info</a>
                    <a href="#popup_menu" data-rel="popup" data-transition="pop" data-role="button" data-icon="bullets">Actions</a>
                </div>
            </div>
        </div>
        <div class="ui-grid-c ui-bar-inherit">
            <div class="ui-block-a">
                <fieldset data-role="controlgroup" data-type="horizontal">
                    <input type="button" value="Start" onclick='btn_start_onclick();'/>
                    <input type="button" value="Stop" onclick='btn_stop_onclick();'/>
                    <a data-role="button" id="btn_wiki" href="javascript:btn_wiki_onclick();">Wiki</a>
                </fieldset>
            </div>
            <div class="ui-block-b">
                <div style="float:left">Serial:<br/>MAC:</div><div id="div-serial" style="float:left;margin-left:10px"></div><br/>
                <div id="div-macaddr" style="float:left;margin-left:10px"></div>
            </div>
            <div class="ui-block-c" id="div-current-test">--None--</div>
            <div class="ui-block-d" id="div-status"></div>
        </div><!-- /grid-c -->
    </div><!-- /header -->

</div>