Height of multiselect varies when adding tags

0 Answers 396 Views
MultiSelect
Laurent
Top achievements
Rank 2
Iron
Iron
Laurent asked on 13 May 2022, 09:18 AM

Hi team,

I found that since 2022 R2, the height of a multiselect varies when adding tags. From 30px height with no values to 32px height with one or more tags.

https://dojo.telerik.com/UVUSaSIn

As a result, there is a nasty pumping effect in the page.

Please advise,

 

Best regards,

Laurent.

Martin
Telerik team
commented on 18 May 2022, 06:19 AM

You can use the below styles to prevent the height from increasing:

.k-multiselect{
     height:30px;
}

Here you will find the modified example for reference.

Laurent
Top achievements
Rank 2
Iron
Iron
commented on 18 May 2022, 08:27 AM | edited

Good morning to you too Martin,

Thank you for your prompt response.

Unfortunately, doing this leads to a bad padding around the k-chip.

I get a better result by doing this:

.k-chip-md {
    padding: 3px 4px;
    font-size: 14px;
    line-height: 1.1;
}

.k-chip-lg {
    padding: 4px 4px;
    font-size: 14px;
    line-height: 1.1;
}

I also change the line-height to avoid clipping on letter donwstroke (sorry, surely bad translated to english).

https://dojo.telerik.com/UVUSaSIn/11

Best regards,

Laurent.

Martin
Telerik team
commented on 23 May 2022, 06:32 AM

Thank you for sharing the styles, I am glad that you were able to find an appropriate solution.

No answers yet. Maybe you can help?

Tags
MultiSelect
Asked by
Laurent
Top achievements
Rank 2
Iron
Iron
Share this question
or