Vertical alignment of image-only button

2 posts, 0 answers
  1. Kaan
    Kaan avatar
    46 posts
    Member since:
    May 2016

    Posted 19 Jun 2017 Link to this post


    When I change the material theme to the default theme, the image inside the image-only button is not vertically aligned in the middle anymore:

    I have a similar issue with toolbar buttons too:

    Currently I am trying to solve the issue with following CSS style, but it's not perfect:

    .k-button .k-image {
        vertical-align: middle;

    Any recommendations?


    Best regards,


  2. Orlin
    Orlin avatar
    60 posts

    Posted 21 Jun 2017 Link to this post

    Hello Kaan,

    Thank you for bringing this to our attention. I have logged a bug in our public issue tracker. You can follow it here:

    As a work around you can continue using your solution or try the following CSS rule:
    .k-button-icon .k-image {
        vertical-align: text-top;

    I have also updated your Telerik points as a token of gratitude. Thank you for reporting this.

    Progress Telerik
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top