Multiselect: Incorrect view with selected items

[BearsPunch]

Describe the bug

After update in common.css.p-icon-wrapper from display: flex to display: inline-flex; with selected items, control renders incorrect, with additional row.

Environment

any

Reproducer

No response

Angular version

16.2.2

PrimeNG version

16.3.1

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

18.14.0

Browser(s)

any

Steps to reproduce the behavior

1. Create Multiselect
2. Select values

Expected behavior

Correct render

[SoyDiego]

Hi, can you share a stackblitz, please?

[MayerMar]

Demo: one p-multiselect with the problem, one p-multiselect with the fix (forced via styles.css)
https://stackblitz.com/edit/7qd5w1?file=src%2Fstyles.scss

Only happens when the Input [showClear] is used.
Class that causes the Problem:

.p-icon-wrapper {
    display: inline-flex;
}

[SoyDiego]

Demo: one p-multiselect with the problem, one p-multiselect with the fix (forced via styles.css) https://stackblitz.com/edit/7qd5w1?file=src%2Fstyles.scss

Only happens when the Input [showClear] is used. Class that causes the Problem:

.p-icon-wrapper {
    display: inline-flex;
}

Thanks for the demo. I will create the PR fixing this issue soon! :)

[SoyDiego]

Hi, I created a PR in the project primeng-sass-theme because is the correct place in this case.
You can check here: primefaces/primeng-sass-theme#54.

I cannot modify the line that you suggested @MayerMar because will affect another styles.
Now it's solved and we should wait PrimeNG Team approve it.

Thanks