jQuery Mobile的用户界面块不排序正确

Question

我试图用jQuery Mobile的命令如下结构：

我做了的jsfiddle和althought代码等于我有什么，我不知道为什么它没有正确地放置结构。 JSfiddle中的代码显示LEFT结构。

http://jsfiddle.net/mXjHJ/557/

我想获得RIGHT结构。顺便说一句，你会看到我只有一个用户界面。

<div class='ui-grid-a'></div> 

谢谢。

编辑：解决http://jsfiddle.net/mXjHJ/564/

Answer 1

试试这个代码：

Fiddle

<div class='ui-grid-a'> 

    <div class='ui-block-a' style='width: 1%'></div> 
    <div class='ui-block-b' style='width: 70%;margin-bottom: 1%;'> 
     <ul data-role='listview' data-inset='true' data-mini='true' data-corners='false'> 
      <li data-role='list-divider' data-theme='b'>A</li> 

      </ul> 
    </div> 

    <div class='ui-block-c' style='width: 25%; margin-left: 1%;'> 
     <ul data-role='listview' data-inset='true' data-mini='true' data-corners='false'> 
      <li data-role='list-divider' data-theme='b'>B</li> 

      </ul> 
    </div> 
     <div class='ui-block-e' style=' 
margin-left: 1%;width:70%;'> 
     <ul data-role='listview' data-inset='true' data-mini='true' data-corners='false'> 
     <li data-role='list-divider' data-theme='b'>D</li> 

     </ul> 
    </div> 
    <div class='ui-block-d' style="width:25%; 
margin-left: 1%;"> 
      <ul data-role='listview' data-inset='true' data-mini='true' data-corners='false'> 
      <li data-role='list-divider' data-theme='b'>C</li> 
       <li>HELLO</li> 
       <li>HELLO</li> 
       <li>HELLO</li> 
      </ul> 
    </div>