Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

Setting the maximum width for a Select box

Posted on 2002-07-27
3
Medium Priority
?
1,695 Views
Last Modified: 2008-03-10
Hi,

I have a Select box that is populated from a database. Some of the entries are 15 characters wide and some are 50. I'd like to be able to set a maximum width for the box of say 20 characters and just cut off (or better yet have a scroll bar like with a Textarea tag).

Here's a sample of the code.

<td>
<div align="right"></div>
     search by employer:
     <form name="form3" method="get" action="results.cfm">
     <select name="mnuEmployer">
     <cfloop query="rsEmp">
          <option value="<cfoutput>#rsEmp.Employer#</cfoutput>" ><cfoutput>#rsEmp.Employer#</cfoutput></option>
     </cfloop>
     </select>
     <input type="submit" value="Submit" name="empbut">
     </form>
</td>
</tr>

Thanks for the help,

Jon
0
Comment
Question by:jonleehacker
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
3 Comments
 
LVL 51

Accepted Solution

by:
ahoffmann earned 150 total points
ID: 7181846
<SELECT STYLE="width:20em;">
  <OPTION STYLE="overflow:scroll">scrollbar in OPTION</OPTION>
</SELECT>

# STYLE="overflow:scroll works for Mozilla 0.9.x and Netscape 6.x, take care with Netscape 7.x and Mozilla 1.x
0
 
LVL 12

Expert Comment

by:lexxwern
ID: 7183122
more about css at http://www.blooberry.com/
0
 
LVL 19

Expert Comment

by:DreamMaster
ID: 7183946
The best you can do for older versions is this:

<select width="50" style="width:50px">
  <option style="overflow:scroll">Scrollbar in option</option>
</select>

The "width=50" part works for netscape as long as the width of the select is shorter. When it gets longer, Netscape looses it, it just wont make it smaller (and I am talking versions 4)

So far, this is the best I have ever been able to do for the looks of select boxes in the different browsers, and don't even mention the browsers on a Macintosh, these have even different sizes for form fields.

I hope this helps a little however.

Max.
0

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When crafting your “Why Us” page, there are a plethora of pitfalls to avoid. Follow these five tips, and you’ll be well on your way to creating an effective page.
Q&A with Course Creator, Mark Lassoff, on the importance of HTML5 in the career of a modern-day developer.
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

715 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question