www.microsoft.com - “Choose a category” drop-down arrow is not visible in “Site Feedback” window

[softvision-oana-arbuzov]

URL: https://www.microsoft.com/en-us/sql-server/

Browser / Version: Firefox Preview Nightly 191205 (🦎: 72.0a1-20191202091209), Firefox Nightly 73.0a1 (2019-12-04) Operating System: Huawei P20 Lite (Android 8.0.0) - 1080 x 2280 pixels, 19:9 ratio (~432 ppi density) Tested Another Browser: Yes Chrome

Problem type: Design is broken Description: Items not fully visible Steps to Reproduce:

1. Navigate https://www.microsoft.com/en-us/store/b/windows?icid=TopNavSoftwareWindows&activetab=tab%3ashopwindows10
2. Dismiss “Newsletter sign up” popup if displayed.
3. Tap “Site feedback” button.
4. Observe “Choose a category” drop-down.

Expected Behavior: Drop-down arrow is visible.

Actual Behavior: Drop-down arrow is not visible.

Note

1. Not reproducible on Chrome 78.0.3904.108
2. Screenshot attached.

Affected area:

<select data-m="{&quot;cN&quot;:&quot;R1Feedback-fcat&quot;,&quot;pid&quot;:&quot;fcat&quot;,&quot;id&quot;:&quot;nn1c2m6r1a3&quot;,&quot;sN&quot;:1,&quot;aN&quot;:&quot;c2m6r1a3&quot;}" id="R1Feedback-fcat" name="fcat" aria-label="What category would you like to give web site feedback on?" required="">
    <option value="">Choose a category</option>
    <option value="SiteNav">Site Navigation (finding what you want)</option>
    <option value="SiteContent">Site Content</option>
    <option value="LanguageQuality">Language Quality</option>
    <option value="SiteDesign">Site Design</option>
    <option value="ProductInformation">Lack of product information</option>
    <option value="SearchingProduct">Searching the product</option>
    <option value="Other">Other</option>
</select>

Watchers: @softvision-oana-arbuzov @softvision-sergiulogigan @cipriansv

sv;

Browser Configuration

• None

From webcompat.com with ❤️

[karlcow]

This will depends on the font which is being used to display the widget. What is happening is that in the list of options, one text is large and if it's large enough depending on the screen and the font it will push the arrow to the right side. Note that the same thing is happening in Chrome, we can't see the right edge of the box.

It's not really a webcompat issue, but I wonder if it is something that browsers should be more clever about. @miketaylr

[lock[bot]]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue at https://webcompat.com/issues/new if you are experiencing a similar problem.