CODEWITHSUNDEEP
javascriptjqueryselectwidthuniform
Mr Coder
Mr Coder

Reputation: 8196

Is it possible to use different size (width) select box with uniform (jquery plugin)?

I want to use multiple select box with multiple width with uniform . Problem is when I do

$('#small').uniform({selectClass:'smallSelect'});

$('#big').uniform({selectClass:'bigSelect'});

<select id="small">
<option>test</option>
</select>

<select id="big">
<option>test2</option>
</select>

Only the first one gets applied i.e bigSelect gets ignored .

Upvotes: 6

Views: 7366

Answers (3)

Pipetus
Pipetus

Reputation: 1136

@evanmcd, I was having the same problem as you and I found that if you set the selectAutoWidth to false it will take your css class into account.

$('select').uniform({selectAutoWidth: false});

and then in the css you define a style for .selector, which is the default cass for the div that holds the select itself.

Upvotes: 2

Code Doggy
Code Doggy

Reputation: 106

You can change the width of each select element by targeting the span that gets generated directly. The code creates a div wrapper with a unique id of uniform-yourid and child span element with the currently selected option. below is the css for your specified ids and you can add.

<style type="text/css">
#uniform-small span
{
    width:100px;
    text-align:center;
}
#uniform-big span
{
    width:200px;
    text-align:center;
}
</style>

Upvotes: 9

jaychapani
jaychapani

Reputation: 1509

uniform.default.css is using image sprite.png for themes.

In this image width of various control is defined. So you can not change them as your requirement.

Upvotes: 0

Related Questions