CODEWITHSUNDEEP
javascriptjqueryhtmlcssjquery-mobile
grzesiekmq
grzesiekmq

Reputation: 429

How to proper positioning elements in jQuery Mobile?

I want to have in listview in listitem (Note: the listitem <li> is generated dynamically with JS) product value on the left and button on the right but I have align="center" in <div data-role="main" align="center"> and get centered product value and button but if I place in <div> (in listitem) product value and in another <div> a button I get on the left product value and on the right button (but in lower line) like this img enter image description here so how to proper position this?

var li = '<li><div>' + productVal + btn + '</div></li>';

so on the left sth and on the right a button here is my code https://jsbin.com/revuto/edit?html,output

actually I have enter image description here but want enter image description here

sorry for Polish text in code so I translate Polish - English

Wprowadź product - provide a product

dodaj - add

usuń- remove

niebezpieczna strefa- danger zone

Upvotes: 1

Views: 38

Answers (1)

Alexander Holman
Alexander Holman

Reputation: 929

use a wrapper classed ui-grid-a and wrap each "column" in a div ui-block-a and ui-block-b

e.g.

<div class="ui-grid-a">
    <label class="ui-block-a" for="input">
        label: <input type="text" id="input">
    </div>
    <div class="ui-block-b">
        <br>
        <button type="button" >Button</button>
    </div>
</div>

Upvotes: 1

Related Questions