JQuery Mobile UI-блок не приказывать право

Question

Я пытаюсь заказать с JQuery Mobile следующую структуру:

Я сделал JSfiddle и Althought кода равно, что у меня есть, я не знаю, почему он не правильно структурирует структуру. Код в JSfiddle показывает структуру LEFT.

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

Я хотел бы получить структуру RIGHT. Кстати, как вы увидите, у меня есть только одна ui-сетка.

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

Спасибо.

Edit: решаемые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>