当前位置 : 主页 > 网页制作 > JQuery >

水平选择全宽jQuery Mobile

来源:互联网 收集:自由互联 发布时间:2021-06-15
我试图询问用户他们的出生日,并遇到一些风格问题. 你应该能够从http://jsfiddle.net/DjsWv/14/了解我的问题 我开始时: fieldset data-role="controlgroup" data-type="horizontal" legendDate of Birth:/legend sele
我试图询问用户他们的出生日,并遇到一些风格问题.

你应该能够从http://jsfiddle.net/DjsWv/14/了解我的问题

我开始时:

<fieldset data-role="controlgroup" data-type="horizontal">
            <legend>Date of Birth:</legend>
            <select name="select-choice-month" id="select-choice-month" data-icon="false">
                <option >Month</option>
                <option value="jan">Jan</option>
            </select>
            <select name="select-choice-day" id="select-choice-day" data-icon="false">
                <option >Day</option>
                <option value="1">1</option>
            </select>
            <select name="select-choice-year" id="select-choice-year">
                <option >Year</option>
                <option value="2011">2012</option>
            </select>
        </fieldset>

这里的问题是我不喜欢宽度不满或100%

我见过的唯一解决方案是使用看起来不适合我的导航栏…如何让这个水平控制组显示为完整/标准宽度的任何想法

工作示例: http://jsfiddle.net/Gajotres/PUVkw/

HTML

<fieldset data-role="controlgroup" data-type="horizontal" class="custom-fieldset">
    <legend>Date of Birth:</legend>

    <select name="select-choice-month" id="select-choice-month" data-icon="false">
        <option >Month</option>
        <option value="jan">Jan</option>
    </select>

    <select name="select-choice-day" id="select-choice-day" data-icon="false">
        <option >Day</option>
        <option value="1">1</option>
    </select>

    <select name="select-choice-year" id="select-choice-year">
        <option >Year</option>
        <option value="2011">2012</option>
    </select>
</fieldset>

CSS

.custom-fieldset .ui-controlgroup-controls {
    width: 100% !important;
}

.custom-fieldset .ui-controlgroup-controls .ui-select {
    width: 33.33% !important;
}

不要忘记在字段集中添加自定义类名,在我的例子中,它被称为:custom-fieldset

编辑

在ericjbasti评论之后,这是一个自定义ID和没有的解决方案!重要:http://jsfiddle.net/Gajotres/PUVkw/1/

网友评论