[Solved] Grid RowTemplate and DetailView

[Muhammad Irfan]

Hello Everyone,
I am using Telerik Grid in my ASP.Net MVC 3 project. I am trying to make some hierarchy (Master-Detail) Grid and also trying to make Row template as per my need.
Here is my code snippet for this

@{
    Html.Telerik().Grid(Model)
        .Name("TimeProjects")
        .Columns(column =>
            {
            column.Bound(e => e.Name).HeaderTemplate("Project Name").Hidden();
            column.Bound(e => e.Person.Name).HeaderTemplate("Customer").Hidden();

            })
        .DataKeys(keys => keys.Add(c => c.ProjectId))
        .RowTemplate(grid => @<text>
        <div class="employee-details">
            <table class="zebra-striped" cellspacing="0" border="0">
                <tr>
                    <td colspan="3" class="subject"><div style="font-size:large;">@Resources.Resource.Project @item.Name</div> <div class="LighterText">@Resources.Resource.Customer @item..Person.Name</div></td><td class="subject">  @Resources.Resource.UpdateClientAuto</td>
                </tr>
            </table>
        </div>

        </text>)
        .DetailView(detailView => detailView.Template(e =>
        {
            Html.Telerik().Grid(e.TimeEntries)
                 .Name("TimeEntry_" + e.PersonId)
                 .Columns(columns =>
                 {
                     columns.Bound(o => o.Description).Hidden();
                     columns.Bound(o => o.ProjectId).Hidden();
                     columns.Bound(o => o.Uom).Hidden();
                     columns.Bound(o => o.SellingPrice).Hidden();
                     columns.Bound(o => o.StartTime).Hidden();
                     columns.Bound(o => o.EndTime).Hidden();
                 })
                 .RowTemplate(grid => @<text>
                        <table cellspacing="0" border="0">
                            <tr style="border-right:0px;">
                                <td>@item.Description</td>
                                <td>
                                    @{
                                        if (item.TotalTime.HasValue)
                                        {
                                            @Math.Round(item.TotalTime.Value.TotalHours, 1)
                                        }
                                        else
                                        {
                                            <text>@Resources.Resource.WorkOn...</text>
                                        }
                                    }
                                </td>
                                <td>@item.SellingPrice/@item.Uom</td>
                                <td style="border-right:0px;">xx</td>
                            </tr>
                        </table>
                       </text>
                    )
                    .Footer(false)
                .Render();

        }))
        .Scrollable(scrolling => scrolling.Height(500))
        .RowAction(row =>
        {
            // Expand initially the detail view of the first row
            if (row.Index == 0)
            {
                row.DetailRow.Expanded = true;
            }
        })
        .Footer(false)
        .Render();
}

Everything is working fine, except the first auto-generated column (for expanding/collapsing detail table) is taking too much space as shown in attach image.
I am wondering, why it is taking that much space? I will really appreciate for any solution as it is very urgent for me.

Thanks in advance.