We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Center Button in Comman Column Grid

Thread ID:





151325 Feb 6,2020 11:00 PM UTC Feb 10,2020 03:53 AM UTC Blazor 3
Tags: Grid
Stefano Capobianco
Asked On February 6, 2020 11:00 PM UTC

Hi, this is my grid definition:

<EjsGrid TValue="Title" AllowPaging="true" Query="@GridQuery">
    <EjsDataManager Url="https://localhost:44319/Titles/Gets" Adaptor="Adaptors.WebApiAdaptor"></EjsDataManager>
    <GridEvents CommandClicked="OnCommandClicked" TValue="Title"></GridEvents>
    <GridPageSettings PageSize="5" PageSizes="true"></GridPageSettings>
        <GridColumn Field=@nameof(Title.Id) HeaderText="Title Id" TextAlign="TextAlign.Center" Width="10"></GridColumn>
        <GridColumn Field=@nameof(Title.TitleAbbreviated) HeaderText="Abbreviazione" TextAlign="TextAlign.Center" Width="10"></GridColumn>
        <GridColumn Field=@nameof(Title.TitleName) HeaderText="Titolo" TextAlign="TextAlign.Center" Width="10"></GridColumn>
        <GridColumn HeaderText="Azioni" TextAlign="TextAlign.Center" Width="10">
                <GridCommandColumn ButtonOption="@(new CommandButtonOptions() { IconCss = "e-icons e-edit", CssClass = "e-flat" })"></GridCommandColumn>
                <GridCommandColumn ButtonOption="@(new CommandButtonOptions() { IconCss = "e-icons e-delete", CssClass = "e-flat" })"></GridCommandColumn>

I would like to center the buttons in GridCommandColumns. It's possible and if yes how.

Thanks in advance

Vignesh Natarajan [Syncfusion]
Replied On February 7, 2020 04:58 AM UTC

Hi Stefano,   

Greetings from Syncfusion support.  

Query: “I would like to center the buttons in GridCommandColumns. It's possible and if yes how. 
Grid Columns can be aligned using its TextAlign property. It will be applied to all the columns including command column. So defining TextAlign property as Center will be applied to CommandColumn also. But we are facing issue in our latest version ( We have considered the reported query as a bug and logged defect report for the same “” . At Syncfusion, we are committed to fixing all validated defects (subject to technological feasibility and Product Development Life Cycle ) and including the defect fix in our next Bi-Weekly release which is expected to be rolled out on or before 26th February, 2020.  
You can now track the current status of your request, review the proposed resolution timeline, and contact us for any further inquiries through this link.  

Till then we suggest you to use below CSS to achieve your requirement as a workaround.   

    .e-grid .e-rowcell.e-unboundcell { 
        text-aligncenter !important; 

Kindly get back to us if you have further queries.  
Vignesh Natarajan 

Stefano Capobianco
Replied On February 7, 2020 08:18 AM UTC

Thank you for the solution, work very well. I'm wait the next service pack to delete from the css the modification suggested.


Vignesh Natarajan [Syncfusion]
Replied On February 10, 2020 03:53 AM UTC

Hi Stefano,  

Thanks for the update.  

We are glad to hear that you have resolved your query using our solution.  

Kindly get back to us if you need any further assistance from us. 
Vignesh Natarajan.  


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon