URL: https://www.linkedin.com/mwlite/me

Browser / Version: Firefox Nightly 68.3a1 (2019-11-27)
Operating System: Huawei P20 Lite (Android 8.0.0) - 1080 x 2280 pixels, 19:9 ratio (~432 ppi density), Samsung Galaxy S7 Edge (Android 8.0.0) - Resolution 1440 x 2560 pixels (~534 ppi pixel density)
Tested Another Browser: Yes Chrome

Problem type: Design is broken
Description: Items are misaligned

Prerequisites:
1. LinkedIn account available and signed in.
Steps to Reproduce:
1. Navigate to https://www.linkedin.com/mwlite/me
2. Scroll down to “Add skills” section.
3. Tap “Add skills” button.
4. Fill in the “Search” filed (e.g Tech).
5. Observe “X” button.

Expected Behavior:
“X” button is correct position in the “Search” field.

Actual Behavior:
“X” button has incorrect position and exceeds the “Search” field area.

Note
1. Not reproducible on Chrome 78.0.3904.108.
2. Not reproducible on Firefox Nightly Desktop layout.
3. Also reproducible on Firefox Preview Nightly.
4. Screenshot attached.

Affected area:

<li-icon class="cancel-icon" type="cancel-icon" size="small" a11y-text="Clear search" aria-hidden="true">
	<svg viewBox="0 0 24 24" width="24px" height="24px" x="0" y="0" preserveAspectRatio="xMinYMin meet" class="artdeco-icon icon">
		<path d="M13,4.32L9.31,8,13,11.69,11.69,13,8,9.31,4.31,13,3,11.69,6.69,8,3,4.31,4.31,3,8,6.69,11.68,3Z" class="small-icon" style="fill-opacity: 1" id="cancel-icon-small"></path>
	</svg>
</li-icon>

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

sv;

From webcompat.com with ❤️