How to style the edit template when using EditMode.Dialog and a custom template?

Hello,

What is the css involved in styling a custom edit template - in particular the background color? Also I notice that fields extend right to the edges of the dialog, how would you set the left and right margins/padding


Thanks


3 Replies

KG Keerthana Ganesan Syncfusion Team September 7, 2022 04:22 PM UTC

Hi Sheldon,

Greetings from Syncfusion support.

we have analyzed your query and are still quite unclear about your exact requirements. Basically, we style templates by traversing the CSS classes. If you want to particularly change the background color of the column, we suggest you use the QueryCellInfo event to customize the cell.

If we understood your query, please share more detail about your exact requirements for your issue. It will be more useful for us to further validate your query and provide the solution as early as possible.

Regards,

Keerthana



SH Sheldon September 7, 2022 04:24 PM UTC

Sorry I wasn't clear. I meant styling the dialog that appears when you Edit a row.



KG Keerthana Ganesan Syncfusion Team September 8, 2022 02:08 PM UTC

Hi Sheldon,

Welcome from Syncfusion support.

We have analyzed your query and we suggest you style the edit dialog with CSS Styling to customize the background of the edit dialog and the margin/padding of the fields in the edit dialog. Kindly refer to the attached code snippet for your reference.

<style>

    .e-dlg-content,.e-dlg-header-content,.e-footer-content{

        background:pink;

    }

    .form-group.col-md-6 {

        padding:20px;

    }

</style>


Kindly get back to us if you have any further queries.

Regards,

Keerthana.


Loader.
Up arrow icon