New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

Fluid and Elastic Capabilities

RadPivotGrid control provides elastic and fluid capabilities which allow keeping the control’s component proportion on different mobile devices.

Fluid capability

By default RadPivotGrid expands to take all the available space in its container (100% of the container) which makes it Fluid.

Elastic capability

Elastic behavior - When you use the RadPivotGrid RenderMode property to Leightweight, changing the font-size for the RadPivotGrid wrapper will resize the control elements accordingly. This is usually achieved by using em units for font-size and padding settings.

As of 2016 Q1 SP1 RadPivotGrid takes the font-size of the page automatically. If the developer does not set it explicitly (Example 1), this is up to the client's browser and a common default value is 16px.

Example 1: Setting default font for the page with the default value for the Telerik controls.

body {
    font-size: 20px;
    font-family: "Segoe UI", Arial, Sans-serif;
}

Example 2: To change the font-size only for RadPivotGrid you can use the code snippet below:

<style type="text/css">
    div.RadPivotGrid,
    div.PivotGridWindow
    {
        font-size: 1.2em;
    }
</style>

RadPivotGrid does not take care of the metrics of the controls that are place in it. This means that if you simply change its font-size that won’t affect the child controls in the template. They should be handled manually.

See also

In this article