CODEWITHSUNDEEP
jqueryjquery-mobilebuttonjqueryi-ui-buttonset
Nathaniel Harman
Nathaniel Harman

Reputation: 347

JQM Buttons in a row?

i'm trying to get 7 buttons in a vertical row, on the left of my viewport in, the first 3 buttons look fine just need to move them down but then the other 4 are not inline with the top 3 heres my code,

<div class="ui-grid-b">
                   <div class="ui-block-a">
                        <div class="ui-block-a"><a href="#" data-role="button" data-theme="a" data-inline="true">btn1</a></div></div>
                        <div class="ui-block-a"><a href="#" data-role="button" data-theme="a" data-inline="true">btn2</a></div></div>
                        <div class="ui-block-a"><a href="#" data-role="button" data-theme="a" data-inline="true">btn3</a></div></div>
                <div class="ui-grid-b">
                   <div class="ui-block-a">
                        <div class="ui-block-a"><a href="#" data-role="button" data-theme="a" data-inline="true">btn4</a></div></div>
                        <div class="ui-block-a"><a href="#" data-role="button" data-theme="a" data-inline="true">btn5</a></div>
                        <div class="ui-block-a"><a href="#" data-role="button" data-theme="a" data-inline="true">btn6</a></div>
                        <div class="ui-block-a"><a href="#" data-role="button" data-theme="a" data-inline="true">btn7</a></div>

enter image description here

Upvotes: 1

Views: 106

Answers (1)

Omar
Omar

Reputation: 31732

You need one ui-grid and one ui-block-a.

Demo

<div class="left-btns ui-grid-a">
  <div class="ui-block-a">
    <a href="#" data-role="button" data-theme="a" data-inline="true">btn1</a><br/>
    <a href="#" data-role="button" data-theme="a" data-inline="true">btn2</a><br/>
    .....
</div>

Upvotes: 1

Related Questions