473,322 Members | 1,778 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,322 software developers and data experts.

Horizontal scroll bars in select box

Hi everyone,

I've got a select box with multiple="yes" with fixed width.
Unfortunately the content that goes into the box is too wide (and I
can't make the box any bigger due to layout restrictions). Is there
anyway of placing horizontal scrollbars on the select box so that the
user can scroll the box to read the rest of the lines? I'm using FF 1.5
and IE 6.

Does anyone have any solutions to get around this problem?

Thanks

Taras

Jul 15 '06 #1
3 61086
Taras_96 wrote:
I've got a select box with multiple="yes" with fixed width.
Unfortunately the content that goes into the box is too wide (and I
can't make the box any bigger due to layout restrictions). Is there
anyway of placing horizontal scrollbars on the select box so that the
user can scroll the box to read the rest of the lines? I'm using FF 1.5
and IE 6.

Does anyone have any solutions to get around this problem?
This should do the trick:

<div style="overflow-x:scroll; width:120px;
overflow: -moz-scrollbars-horizontal;">
<select multiple name="mySelect" size="3">
<option value="1">one two three four five six</option>
<option value="2">seven eight</option>
<option value="3">nine ten</option>
</select>
</div>

Hope this helps,

--
Bart

Jul 15 '06 #2
jim
Taras,
Try using the size="2" attribute; it sets the length of viewable
options in your select box.
eg:
-----------------------------------------
<style type="text/css">
#selectbox{
width:120px;
background-color:cyan;
border:0px;
color:navy;
text-align:center;
font-size:11pt;
font-family:garamond;
}
</style>
</head>
<body>
<form name="myform">
<select multiple="true" name="selectbox" id="selectbox" size="2" >
<option value="one">One</option>
<option value="two">Two</option>
<option value="three">Three</option>
<option value="four">Four</option>
<option value="five">Five</option>
<option value="six">Six</option>
<option value="seven">Seven</option>
</style>
</form>
</body>

Jul 18 '06 #3
Hi Bart,

Your suggestion worked pefectly. I tried doing something similar except
to the select element (which didn't work). It works both in IE and FF.
The only problem is that in IE you can't change the select boxe's
border, so if you put a border around the containing div, you get two
borders in IE (which looks kind of bad).

Anyway of getting around this in IE? Possibly without using an outer
div?

Thanks

Taras
Bart Van der Donck wrote:
Taras_96 wrote:
I've got a select box with multiple="yes" with fixed width.
Unfortunately the content that goes into the box is too wide (and I
can't make the box any bigger due to layout restrictions). Is there
anyway of placing horizontal scrollbars on the select box so that the
user can scroll the box to read the rest of the lines? I'm using FF 1.5
and IE 6.

Does anyone have any solutions to get around this problem?

This should do the trick:

<div style="overflow-x:scroll; width:120px;
overflow: -moz-scrollbars-horizontal;">
<select multiple name="mySelect" size="3">
<option value="1">one two three four five six</option>
<option value="2">seven eight</option>
<option value="3">nine ten</option>
</select>
</div>

Hope this helps,

--
Bart
Jul 21 '06 #4

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

0
by: Axel Dahmen | last post by:
I'm just transcoding my HTML pages from Quirks to Standard mode. Doing so I noticed that whenever a frame's content overflows its frame, TWO scroll bars appear in Standard mode, a vertical and a...
1
by: Programmer | last post by:
Hi! I've just started using the XVT portability kit in my C++ application, which has a lot of dialogs with list boxes. I ran into an issue when I started using the list boxes. The horizontal...
1
by: RJN | last post by:
Hi I'm using an iFrame to enclose another document. The iFrame width is sufficient to hold the enclosed document. When the enclosed document has more data and exceeds the height set for iFrame,...
0
by: jojobar | last post by:
We are using the ASP:Menu control (horizontal) for site navigation. The menu is contained by a table with css styles that allows us to give the illusion of a menu bar that runs the entire width of...
69
by: RC | last post by:
I know how to do this in JavaScript by window.open("newFile.html", "newTarget", "scrollbars=no,resizable=0,width=200,height=200"); The browser will open a new window size 200x200, not allow...
1
by: David_from_Chicago | last post by:
I am developing an application in Access 2000 (A2K) which has multiple forms and subforms. Until now, all subforms displayed scroll bars properly (according to the subform's property setting). ...
6
by: robertko2 | last post by:
For some reason I can't get vertical or horizontal scroll bars to function at all. They show up at run time, but look like their disabled. I need to make sure that anyone with a low screen resolution...
1
by: eliteflyerteam | last post by:
i was looking for advice on a javascript function - i have horizontal scroll bars disabled using, <body style="overflow-x:hidden;"> but i want to create a function so that when i resize the browser...
1
by: icancreate | last post by:
Anyone know how I can achieve the following. I want to place an animated banner into my homepage that extends beyond the width of the viewing area in the web browser without the browser displaying a...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.