min-width setting for command buttons in Grid.

2 posts, 0 answers
  1. Genadij
    Genadij avatar
    7 posts
    Member since:
    Mar 2010

    Posted 10 Apr Link to this post

    Hi,

    I have changed the style for command buttons in Grid using CSS:

    .abutton,
    div.k-grid .k-grid-edit,
    div.k-grid .k-grid-delete,
    div.k-grid .k-grid-cancel,
    div.k-grid .k-grid-update {
        display: inline-block;
        width: 16px;
        height: 16px;
        padding: 0px 0px 0px;
        text-align: center;
        text-indent: -444px;
        border: 0;
    }

    div.k-grid .k-grid-edit {
        background: url('/Content/Icons/edit.png');
    }

    div.k-grid .k-grid-delete {
        background: url('/Content/Icons/cancel.png');
    }

    div.k-grid .k-grid-cancel {
        background: url('/Content/Icons/cancel.png');
    }

    div.k-grid .k-grid-update {
        background: url('/Content/Icons/ok.png');
    }

    After that all command buttons still have the width equal 64px coming from kendo-common-bootstrap.css  or kendo-common.css:

    .k-grid tbody .k-button, .k-ie8 .k-grid tbody button.k-button {

        min-width: 64px;

    }

    Unfortunately I cannot find the way to UNSET or set min-width to 16px as I need.

    Could you please help.

    Kind regards

    Genadij

     

  2. Preslav
    Admin
    Preslav avatar
    247 posts

    Posted 12 Apr Link to this post

    Hello Genadij,

    I was not able to replicate the problem on my side by using the provided CSS code.

    Based on your post, I assume that you are using Internet Explorer 8. That said, it might be the cause for this behavior as IE 8 is no longer supported by Kendo UI. More information about the supported web browsers is available here:

    http://docs.telerik.com/kendo-ui/intro/supporting/browser-support

    Further, I would like to continue my investigation and it will help me a lot if you prepare and share an isolated sample Dojo that clearly reproduces the issue.

    Finally, you might be interested in Kendo UI Web Font Icons. 

    http://docs.telerik.com/kendo-ui/styles-and-layout/icons-web

    You could use these icons to easily change the default ones.

    I look forward to hearing from you. 

    Regards,
    Preslav
    Telerik by Progress
    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