TileLayout reduce header size and padding between container

2 posts, 0 answers
  1. Hung
    Hung avatar
    15 posts
    Member since:
    Sep 2017

    Posted 14 Sep Link to this post

    How do I reduce the Tile container header font size, reduce header size and remove padding between containers?


  2. Nikolay
    Nikolay  avatar
    222 posts

    Posted 16 Sep Link to this post

    Hello Hung,

    The containers' headers font size can be modified with the following CSS:

    .k-tilelayout-item-header .k-card-title {
        font-size: 1rem;

    The space between the layout items is exposed for adjustment via the gap.rows and gap.columns properties:

    gap: {
        columns: 5,
        rows: 5

    All of the above can be examined live in the following Dojo demo:

    Let me know if you have any questions.

    Progress Telerik

    Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Back to Top