Icons for components are too high (kendo+bootstap 3)

[Logan]

All of the icons that are placed on the kendo controls are a bit too high (see attached images).  I believe this started when I installed bootstrap, but I am not sure of the best fix.

Thanks

[Dimo]

Hello Logan,

The problem is caused by a little obscure difference in HTML/CSS web standards. I suspect that you are using an XHTML 1.0 Transitional DOCTYPE. In this case inline-block elements ignore the vertical-align property if they have no sibling text nodes. The issue is not exhibited with other DOCTYPEs. You have two options:

+ change the DOCTYPE to XHTML 1.0 Strict, XHTML 1.1 or HTML 5
+ use the following CSS rule to add a phantom text node:

.k-select:after {
    content: "\a0";
    display: inline-block;
    width: 0;
}

Since there have been a couple of reports for this phenomenon, we will include the fix in future versions of Kendo UI.

https://github.com/telerik/kendo-ui-core/issues/22

Regards,
Dimo
Telerik

 

 

[Logan]

That fixed my problem. 
Thanks,
Logan