I am currently working with Rails 3.
To adjust the size of a select drop-down menu to 330px, I made changes in my css file like so:
select {
width: 330px;
{
However, I encountered an issue when trying to set another page's drop-down menu width to 230px using a class on the select tag:
select.ul-item {
width: 230px;
{
Below is the view page where I want the drop-down menu width to be 230px:
<ul>
<li><%= select_tag(:gender, options_for_select(['Male', 'Female', 'Unisex'])) %></li>
<li><%= select_tag(:age_range, options_for_select(['Birth-12 Mos.', '12-24 Mos.', '2 Years', '3-4 Years', '5-7 Years', '8-11 Years', '12+ Years'])) %></li>
</ul>
After some troubleshooting and updates, it turns out that setting the widths without the selector worked best:
#gender, #age_range {width: 230px}
It's surprising how it works this way even though there is no direct selector. Thank you for assisting me in finding the solution.