Closed Bug 924068 Opened 11 years ago Closed 8 years ago

select right border is missing

Categories

(Core :: Layout: Form Controls, defect)

22 Branch
x86_64
Windows 8
defect
Not set
normal

Tracking

()

RESOLVED DUPLICATE of bug 545685

People

(Reporter: aprjanka, Unassigned)

References

Details

(Keywords: regression)

Attachments

(5 files)

User Agent: Mozilla/5.0 (Windows NT 6.2; WOW64; rv:24.0) Gecko/20100101 Firefox/24.0 (Beta/Release)
Build ID: 20130910160258

Steps to reproduce:

Applied css width in em to a select element.

http://jsfiddle.net/qLQaq/




Actual results:

The dropdown right border is missing.


Expected results:

The dropdown should have borders on all side.
Attached image border.jpg
Not on my side,the right border is visible.
Component: Untriaged → Layout: Form Controls
Product: Firefox → Core
(In reply to Loic from comment #1)
> Created attachment 814153 [details]
> border.jpg
> 
> Not on my side,the right border is visible.

I've found it depends on the browser window size.
1024x768 no border
1025x768 has border
1026x768 no border
Attached image 1024x768.PNG
Attached image 1025x768.PNG
Attached image 1026x768.PNG
It's due to:
Jonathan Kew — bug 844604 - default to auto devPixelsPerPx setting on windows. r=jimm
I gthink.
Blocks: 844604
Status: UNCONFIRMED → NEW
Ever confirmed: true
Keywords: regression
Version: 24 Branch → 22 Branch
(In reply to Loic from comment #6)
> It's due to:
> Jonathan Kew — bug 844604 - default to auto devPixelsPerPx setting on
> windows. r=jimm
> I gthink.

devPixelsPerPx is default for me (-1)
I'm on low res displays (19'' 1280x1024), dpi is 100% in windows (default).
Can you test by changing the Windows DPI value by 125% e.g. On my machine (1920x1080), the DPI is medium (125%).
With DPI 125% the border is ok.
Anyway even with DPI at 125%, I'm able to see this bug.
Example on this page: http://i.imgur.com/8TDenih.png
Similar example - Fx on fullscreen, 1600x900 - right border not visible. Resized to smaller window border becomes visible.

http://jsfiddle.net/mcXkj/1/
Mozilla/5.0 (Windows NT 6.3; WOW64; rv:34.0) Gecko/20100101 Firefox/34.0
devPixelsPerPx: default (-1)
Resolution: 1920 x 1200

I've seen the same odd window-size select-box right-side-border bug for a while now. It appears for me in aprjanka@gmail.com's example and Artur Muszynski's example (and also appears if I change the css font-size from "em" to "px").
See Also: → 429302
Attached image select-border-bug.png
User Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:43.0) Gecko/20100101 Firefox/43.0
Build ID: 20160105164030

Looks like I found a simple test case:
https://jsfiddle.net/yecb5pqa/1/

To get this bug the following conditions must be met:
1. You need container (<body> is enough) with odd width (ex. 101).
2. Inside it another container with width that has decimal part (ex. 91.35) and margin set to "0 auto"
3. <select> inside second container with width set to 100% 

Some time bug shows as thicker right border instead of no border.
Still an issue in Firefox 44.0.2

User Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:44.0) Gecko/20100101 Firefox/44.0
Build ID: 20160210153822


Confirmed with jsfiddle mentioned above.
Blocks: 1230801
(In reply to Loic from comment #1)
> Created attachment 814153 [details]
> border.jpg
> 
> Not on my side,the right border is visible.

I noticed the issue comes when we have the scroll-bar visible. With full window size, it doesn't appear. When we have the scroll-bar, the right border of the combo is missing.
+1

I've been able to replicate this only when width is set to 100% (or other high percentages). Using precise pixel values "solves" the issue.
Status: NEW → RESOLVED
Closed: 8 years ago
Resolution: --- → DUPLICATE
No longer blocks: 1230801
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: