# Fluid and Elastic Capabilities

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

## Fluid capability

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

If you want the form to expand based on the content then add **rdfInlineBlock** class to the wrapper div element

## Elastic capability

**Elastic behavior** - the form itself and the text in it (label and field hint text, as well as their margin and paddings) are scalable based on the base font size.

> note As of 2016 Q1 SP1 **RadDataForm** takes the [font-size](https://www.telerik.com/products/aspnet-ajax/documentation/styling/controlling-visual-appearance/fonts) 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.

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

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

> caption **Example 2**: You can use the code snippet below to change only the font-size of **RadDataForm**:

```ASPNET
<style type="text/css">
    div.RadDataForm
    {
        font-size: 15px;
    }
</style>
```

> note RadDataForm 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

* [Fonts](https://www.telerik.com/products/aspnet-ajax/documentation/styling/controlling-visual-appearance/fonts)
* [Visual and Dimension Improvements in UI for ASP.NET AJAX](http://www.telerik.com/blogs/visual-and-dimension-improvements-in-ui-for-asp.net-ajax)