Ext.net rowexpander resize header not resize content

Question

I am using .net 4 with ext.net 2.2 I face the above problem: I have the above gridpanel

<ext:GridPanel ID="GridPanelSites" runat="server" StoreID="StoreSites" Title="" ForceFit="true">
    <View>
        <ext:GridView ID="GridViewSites" runat="server" LoadMask="true" LoadingText="" />
    </View>
    <SelectionModel>
        <ext:RowSelectionModel ID="RowSelectionModelSites" runat="server" />
    </SelectionModel>
    <ColumnModel>
        <Columns>
            <ext:Column ID="col_address" runat="server" DataIndex="address" Text="" />
            <ext:Column ID="col_city" runat="server" DataIndex="city" Text="" />
            <ext:Column ID="col_contact_name" runat="server" DataIndex="contact_name" Text="" />
            <ext:Column ID="col_police_phone1" runat="server" DataIndex="police_phone1" Text="" />
            <ext:Column ID="col_children" runat="server" DataIndex="children" Text="" />
            <ext:Column ID="col_old_people" runat="server" DataIndex="old_people" Text="" />
            <ext:Column ID="col_total_people" runat="server" DataIndex="total_people" Text="" />
            <ext:ImageCommandColumn ID="col_edit" Text="" Align="Center" Width="100" runat="server">
                <Commands>
                    <ext:ImageCommand ToolTip-Text="" CommandName="cmdEditSite" Icon="HouseLink" />
                </Commands>
                <Listeners>
                    <Command Fn="onCommand" />
                </Listeners>
            </ext:ImageCommandColumn>
        </Columns>
    </ColumnModel>
    <Features>
        <ext:GridFilters runat="server" ID="GridFiltersMSites" Local="true">
            <Filters>
                <ext:StringFilter DataIndex="address" />
                <ext:StringFilter DataIndex="contact_name" />
                <ext:StringFilter DataIndex="total_people" />
            </Filters>
        </ext:GridFilters>
    </Features>
    <Plugins>
        <ext:RowExpander>
            <Component>
                <ext:GridPanel ID="GridPanelChildren" runat="server" Height="300" Layout="FitLayout"
                    StoreID="StoreActions" Title="">
                    <View>
                        <ext:GridView ID="GridViewChildren" runat="server" LoadMask="true" LoadingText="" />
                    </View>
                    <SelectionModel>
                        <ext:RowSelectionModel ID="SelectionModelChildren" runat="server" />
                    </SelectionModel>
                    <ColumnModel>
                        <Columns>
                            <ext:Column ID="col_child_actiondescription" runat="server" DataIndex="action_description"
                                Text="" />
                            <ext:Column ID="col_child_type" runat="server" Width="70" DataIndex="actiontype_description"
                                Text="" />
                            <ext:Column ID="col_child_description" runat="server" Width="300" DataIndex="description"
                                Text="" />
                            <ext:Column ID="col_child_date" runat="server" Width="150" DataIndex="inserted_date"
                                Text="" />
                            <ext:Column ID="col_child_user" runat="server" Width="150" DataIndex="update_user_fullname"
                                Text="" />
                        </Columns>
                    </ColumnModel>
                    <Features>
                        <ext:GridFilters runat="server" ID="GridFiltersActions" Local="true">
                            <Filters>
                                <ext:StringFilter DataIndex="action_description" />
                                <ext:ListFilter DataIndex="actiontype_description" />
                                <ext:StringFilter DataIndex="description" />
                                <ext:StringFilter DataIndex="update_user_fullname" />
                                <ext:DateFilter DataIndex="inserted_date" />
                            </Filters>
                        </ext:GridFilters>
                    </Features>
                </ext:GridPanel>
            </Component>
            <DirectEvents>
                <BeforeExpand OnEvent="BeforeExpandChild">
                    <EventMask Msg="" ShowMask="true">
                    </EventMask>
                    <ExtraParams>
                        <ext:Parameter Name="id" Value="record.getId()" Mode="Raw" />
                    </ExtraParams>
                </BeforeExpand>
            </DirectEvents>
        </ext:RowExpander>
    </Plugins>
</ext:GridPanel>

When i re-size the header of the parent, the row data re-sized as well and if the data of a column are larger than the column, data break and appear 3 dots. The problem is when i expand the the parent row child grid appears like the above picture. . Re-size header but the data not change their width. I am trying to find a solution to that for the last 3 days.

I will appreciate any kind of help.

Answer 1

Based on this solution http://forums.ext.net/showthread.php?13168&p=54291&viewfull=1#post54291, try to add the following CSS to your page:

.x-grid .x-row-expander-control table {
    table-layout: fixed;
}