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.
As of 2016 Q1 SP1 RadDataForm 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: You can use the code snippet below to change only the font-size of RadDataForm:
<style type="text/css">
div.RadDataForm
{
font-size: 15px;
}
</style>
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.