238504 - A Right Positioned Select Box with Fixed Width Partially Pops Outside Screen on a Maximized Window

Status: RESOLVED DUPLICATE of bug 207533

(Core :: Layout: Form Controls, defect)

Description

[David Anderson]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:1.6) Gecko/20040206 Firefox/0.8
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:1.6) Gecko/20040206 Firefox/0.8

I have a select box on the right side of the browser with a fixed width.
We I attempt to make a selection, the options pop up, but part of the option
area lands outside of the browser window, including the scroll bar (and can't be
seen in a maximized browser window).

Reproducible: Always
Steps to Reproduce:
1. Click on select box drop down
Actual Results:  
Only part of the options area is visible, the right side lands outside the
browser window and can't be seen in a maximized browser window

Expected Results:  
The browser should shift the option area to the left to make options selectable
on maximized browser windows,
or, if not, at least the options scroll bar should be accessible.

Why it is that I feel I'm going to get hammered with an INVALID for this?

Comment 1

[dolphinling]

Just read through the HTML and CSS specs and I didn't see anything that said we
couldn't shift it to the left a bit so it stays on the screen.

Comment 2

[Yves Nicol]

I'm experiencing the same problem. 

I have a select box in the center of the screen which displays a large amount 
of elements, which are also very wide in some cases

The listbox (which has a fixed width defined with a css file) displays about 17 
elements (out of 25) without respecting the width of the select box. In this 
situation, the list box diplays elements outside the screen (800x600) on the 
right side and on the bottom or top of the screen.

If an element of the select box contains many characters, when clicking on the 
arrow of the select box, the selection rectangle has a width that corresponds 
to the longest element (even if the width of the control was defined in a css 
file or in the style tag of the control), which does not fit the screen and 
hide the scrollbar on the right. The scrollbar being displayed on the right, 
the user cannot scroll to display all the elements because the scrollbar is 
outside the screen. 
Because there is so many elements to display in the list, the visible elements 
are either shown on the top of the screen or on the bottom, but in either case, 
the list does not fit the screen and some elements are not visible.

We do not see this problem when using IE5+, the application is an ASP.NET 
application, in whiwh the select box was created as a DropDownList, but i have 
also experienced the same problem in developing a simple html page. I have 
tried to define special style in the css file for this control (select box) 
without any success.

Is there any solution when using Mozilla to avoid this display problem with a 
select box?
It's a very important problem in our project and could force our managers to 
choose another browser (IE).

Regards,

Yves Nicol.

Comment 3

[Jesiah S]

This is a dupe of bug 207533. You should be aware that when setting the width of
a SELECT you might see bug 232540. 

Yves: You are seeing bug 53092 which was marked INVALID.  Bug 207533 will help
your situation.  I did find that you can use this CSS to shrink the dropdown box.
SELECT {width:6em;} 
OPTION {max-width:6em;overflow:hidden;} 
 I have no idea what IE will do with the CSS.  

*** This bug has been marked as a duplicate of 207533 ***