Column Fields in two lines

[Jose]

hi,

i'm using the pirvotgrid to show many fields but i'm trying to show column fields in two lines because i saw all the fields in one line and the part where i look all the information is really small can i show this fields in two lines? 

this is my code and image

<telerik:RadPivotGrid Width="100%"   AllowPaging="true" OnNeedDataSource="RadPivotGrid1_NeedDataSource"
        ID="RadPivotGrid1" runat="server" ColumnHeaderZoneText="ColumnHeaderZone"
         EnableToolTips="true"
        AllowFiltering="true" ShowFilterHeaderZone="false" ErrorValue="0"
         AllowSorting="True"  >
        <ClientSettings EnableFieldsDragDrop="true">

            <Scrolling AllowVerticalScroll="true" />
        </ClientSettings>
         <Fields>
            <telerik:PivotGridRowField DataField="field1" Caption ="field1">
            </telerik:PivotGridRowField>
            <telerik:PivotGridRowField DataField="field2" Caption ="field2">
            </telerik:PivotGridRowField>
            <telerik:PivotGridRowField DataField="field3" Caption ="field3">
            </telerik:PivotGridRowField>
            <telerik:PivotGridRowField DataField="field4" Caption ="field4">
            </telerik:PivotGridRowField>

            <telerik:PivotGridColumnField DataField="field5" Caption ="field5">
            </telerik:PivotGridColumnField>
             <telerik:PivotGridColumnField DataField="field6" Caption ="field6">
            </telerik:PivotGridColumnField>
             <telerik:PivotGridColumnField DataField="field7" Caption ="field7">
            </telerik:PivotGridColumnField>
             <telerik:PivotGridColumnField DataField="field8" Caption ="field8">
            </telerik:PivotGridColumnField>


            <telerik:PivotGridAggregateField DataField="field9" Aggregate="Sum"  Caption ="field9" >
            </telerik:PivotGridAggregateField>
            <telerik:PivotGridAggregateField DataField="field10" Aggregate="Sum"  Caption ="field10" >
            </telerik:PivotGridAggregateField>
             <telerik:PivotGridAggregateField DataField="field11" Aggregate="Sum"  Caption ="field11"  >
            </telerik:PivotGridAggregateField>
             <telerik:PivotGridAggregateField DataField="field12" Aggregate="Sum"  Caption ="field12">
            </telerik:PivotGridAggregateField>
             <telerik:PivotGridAggregateField DataField="field13" Aggregate="Sum"  Caption ="field13">
            </telerik:PivotGridAggregateField>
             <telerik:PivotGridAggregateField DataField="field14" Aggregate="Sum"  Caption ="field14">
            </telerik:PivotGridAggregateField>
             <telerik:PivotGridAggregateField DataField="field15" Aggregate="Sum"  Caption ="field15">
            </telerik:PivotGridAggregateField>
             <telerik:PivotGridAggregateField DataField="field16" Aggregate="Sum"  Caption ="field16">
            </telerik:PivotGridAggregateField>
             <telerik:PivotGridAggregateField DataField="field17" Aggregate="Sum"  Caption ="field17">
            </telerik:PivotGridAggregateField>

        </Fields>
        <ClientSettings>
            <Scrolling AllowVerticalScroll="true"></Scrolling>
        </ClientSettings>

</telerik:RadPivotGrid>

Image

thanks

[Antonio Stoilkov]

Hello Jose,

You could achieve your scenario by using the CSS provided below. The idea is to place each of the aggregate fields on different line because they take most of the space in the pivot grid table. Note that it is not possible to place the row fields on different lines because they are placed in <td> elements. However, we will introduce a new functionality in our beta release which will enable to group fields in popup and minimize the space required to show fields in each individual zone.

div.RadPivotGrid .rpgDataZone
{
    white-space: normal;
}

.RadPivotGrid .rpgFieldItem
{
    margin-bottom: 5px;
}

All the best,
Antonio Stoilkov
the Telerik team