2+ jquery mobile horizontal checkboxes in one page messed up

Question

I need two horizontal checkboxes in one page:

<div data-role="content">
        <div data-role="fieldcontain" data-controltype="checkboxes">
            <fieldset data-role="controlgroup" data-type="horizontal" id="buddies">
                <legend>Hobbies (separates by ',')</legend>
            </fieldset>
        </div>
        <div id="language" data-role="fieldcontain" data-controltype="checkboxes">
            <fieldset data-role="controlgroup" data-type="horizontal">
                <legend>Languages (ordered by native, second lang...)</legend>
                <input id="eng" type="checkbox">
                <label for="eng">English</label>
                <input id="zho" type="checkbox">
                <label for="zho">国语</label>
                <input id="jpn" type="checkbox">
                <label for="jpn">日本語</label>
            </fieldset>
        </div>
        <div class="ui-grid-a">
            <div class="ui-block-a">
                <a data-role="button" id="revert">Revert</a>
            </div>
            <div class="ui-block-b">
                <input value="Update" type="submit">
            </div>
        </div>
    </div>

One image is more than a thousand words. As you see, two checkboxes' totally messed up:

Answer 1

Old fashion table tag works!!!