DropdownList loading icon causes weird widget height change

[Laurent]

Hi Team,

When a drodpdownlist is loading data, the loading icon (k-input-loading-icon) has a wrong height causing the widget height to change too, resulting in a weird "pumping effect" in the form.

To reproduce, simply look at the dropdownlist demo page :

https://demos.telerik.com/kendo-ui/dropdownlist/cascadingdropdownlist?autoRun=true&theme=bootstrap-main

Any workaround?

 

Regards,

Laurent.

[Neli]

Hello Laurent,

You can use the .k-loading-icon class and customize the styles. Below is an exmaple:

<style>
  .k-i-loading{
    height: 5px !important;
    font-size: 8px !important;
  }
</style>

Here is a Dojo where this is demonstrated.

Regards,
Neli
Progress Telerik

[Kendo Dude]

I fixed that issue by adding the below css to my site.css. This should be fixed in the Telerik css.

.k-i-loading {

min-height: 5px !important;

max-height: 5px !important;

}

 

[Neli]

Hi Karl,

Thank you for sharing a possible workaround to the issue. I have updated the related issue in our kendo-themes GitHub repository.

As a token of gratitude for suggesting a workaround your Telerik points are now updated.

Regards,

Neli