How to set Details column width

[CLAUDIO RICCARDI]

Hi,

after calling .DetailsTemplate("#TemplateId"), the grid shows a column with the details selector (triangle).

This column is quite large. How can I set the width of the details column selector? I tried to overwrite some css styles (.e-detailheadercell or e-detailrowcollapse) without success.

Can you help me?

Thanks in advance

Claudio

Attachment: chrome_hChp5BhmgP_e314d004.zip

[Sreedhar Kumar Panarapu Sreenivasulu Panarapu]

Hi Claudio Riccardi ,

Greetings from Syncfusion support!

We reviewed your query and noticed that you want to customize the width of the details column selector in the Grid. To assist you effectively, could you please confirm whether you are using the EJ1 Grid or the EJ2 Grid component? This will help us provide a solution tailored to your specific version.

Documentation of EJ2 Grid: Getting Started with ASP.NET MVC Grid Control | Syncfusion

Looking forward to your response.

Best regards,
Sreedhar Kumar.

[CLAUDIO RICCARDI]

Hi.

Currently I'm using EJ1 Grid.

Best regards.

[Sreedhar Kumar Panarapu Sreenivasulu Panarapu]

Hi  Claudio Riccardi,

 

Thank you for confirming the version,

You can adjust the width of the details column selector using CSS styles. Apply the following CSS to modify the width of the first column:

<style>  

 .e-table colgroup col:first-child 

{     

  width: 10px !important; /* Adjust width as needed */ 

   } 

</style>

This will ensure that the first column (which contains the details selector) has the specified width.

We have attached reference image: 

Let us know if you need any further assistance.

Best regards,
Sreedhar Kumar.

[CLAUDIO RICCARDI]

Thank you! Problem solved!

[Sreedhar Kumar Panarapu Sreenivasulu Panarapu]

Hi Claudio Riccardi,

You're welcome! Please feel free to reach out if you need any further assistance.

Best regards,
Sreedhar Kumar.