JQuery Uniform Sample Size

Question

How to change input selection size using jQuery Uniform?

http://uniformjs.com

Answer 1

<script> $('div.selector span', $('#parent_span')).css('width', '600px'); $('div.selector', $('#parent_span')).css('width', '630px'); </script> <span id="parent_span"> <select style="width:630px;"> </select> </span> 

Answer 2

Change the width for div.selector span using CSS, but you will also have to consider the width of the parent tag.

Answer 3

This is what worked for me:

set selectAutoWidth : true when creating.

eg:

$("select, input, textarea, input:checkbox, input:radio, input:file").uniform({selectAutoWidth : true});

then specify the width of the selection. for example: <select id="xx" style="width:70px;">

Answer 4

It’s bad practice to use inline style. Here is the correct way to do this according to Uniform docs:

If you want to specify the size of the select element and then wrap it evenly accordingly, there will be some difficulty. The size of the item must be detected, and then the uniform will be resized. To do this, you are invited to make one of these solutions if you have problems.

• Set custom inline width for element () (wrong practice)

  OR

• Use two css rules; select {width: XXpx} and .selector select {width: 100%}

So, using the second option, in your css file do:

 #parent_span select {width:630px;) #parent_span .selector select {width:100%;} 

The 630px trick is used to create a wrapper around a Uniform div, and then a second kick of CSS code, as a result of which the select tag occupies 100% of it.