---
title: "CSS Properties on Form Controls"
slug: "css-properties-on-form-controls"
description: "Learn how to apply predefined or custom CSS classes to Form controls and configure borders, backgrounds, fonts, alignment, and other styles."
updated: 2026-04-27T20:46:19Z
published: 2026-04-28T14:12:48Z
canonical: "documentation.decisions.com/css-properties-on-form-controls"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://documentation.decisions.com/llms.txt
> Use this file to discover all available pages before exploring further.

# CSS Properties on Form Controls

## Overview

The appearance of a Form control can be changed by applying [pre-defined or custom CSS classes](/version-10/docs/pre-defined-css-classes-for-forms). Each Form control has various properties that the CSS stylesheet can be applied to, including border, background, font, alignment, etc.

---

## Form Control CSS Properties

After a Form control has been added to the Form workspace, the appearance can be changed by applying the appropriate CSS class to the control under the VIEW category. Below is a list of the CSS properties that can be set on various Form controls after [applying a stylesheet to the Form](https://documentation.decisions.com/version-10/docs/using-css-in-forms).

| Property | Description |
| --- | --- |
| CSS Class | Allows a user to define the CSS class to apply to the selected control |
| Use Form Font | Allows a user to use the default Form font style or to override the style |
|  | Label Attributes | Allows a user to define the font family, font size, and whether the text is bold, italic, or underlined |
| Translate Text | Check this setting to allow for text translation. |
| Override Background Color | Check this setting for a Background Color picker to appear in the Properties tab. This color picker allows the Designer to change the background color of the Button. |
| Text from Data Name | Check this setting to allow the configuration of a String Variable pulled from the data in a Flow to be used as the text name for this button |
| Show Underline | Displays an underline under text |
| Alignment | Sets the horizontal alignment of the control |
| Vertical Alignment | Sets the vertical alignment of the control |
| Watermark | Adds a watermark to the control |
| Translate Watermark Text | Allows the watermark text to be translated |
| Border width | Sets the border width on the control |
| Corner radius | Sets the corner radius of the control |
| Background type | Sets what the background of the control will be |
|  | Transparent | Removes the default colored background and sets it to be transparent |
|  | Color | Allows a user to specify a color for the control's background |
|  | Image | Allows the user to specify an image as the background |
| Inner Margin | Sets the inner margin of the control |
| Outer Margin | Sets the outer margin of the control |
| Tab Button CSS Class | Defines the CSS class of the Tab Container button |
| Tab Panel Css Class | Defines the CSS class of the Tab Container Panel |
| Clock Css Class | Defines the CSS of the clo |
| DropDown List Css Class | Define the CSS class for the dropdown list |
| TextBox Css Class | Define the CSS class for Textbox control |
| Container CSS Class | Define the CSS class for a container |
| Item Css Class | Define the CSS class for an item |
| Item Text CSS Class | Define the CSS class for the text for an item |
| Is Horizontal | Sets whether the control appears horizontal |
| Border | Sets the border on the control |
|  | Border Thickness | Sets the border thickness |
| Down Arrow Css Class | Define the CSS class for the down arrow |
| Up Arrow Css Class | Define the CSS class for the up arrow |
| Border color | Defines the border color for the control |
| Label Holder Css Class | Define the CSS class for the label holder |
| Image CSS Class | Define the CSS class for image control |
| Label CSS Class | Defines the CSS class for the label |
| Show Search Box | Will display a search box |
| Timeline Item CSS Class | Define the CSS class for the item in the timeline |
| FileName Css Class | Define the CSS class for the FileName |
| Dialog Header Class | Defines the CSS class for the header of the dialog |
| Dialog Body Class | Defines the CSS class for the body of the dialog |
| Dialog Footer Class | Defines the CSS class for the dialog footer |
| Size To Image | Changes the |
| Row Text Alignment | Sets the text alignment for the row |
| Cell Label Attributes | Sets the settings for the cell text |
| Header Label Attributes | Sets the settings for the header label |
| Link CSS Class | Defines the CSS class for link |
| ProgressBar CSS Class | Define the CSS class for the progress bar control |
| Header height | Sets the height of the header |
| Header |
|  | Border type | Define the CSS class for the progress bar control |
|  |  | Bottom | Adds a bottom border to the header |
|  |  | Full | Add a border to the header |
|  |  | Off | Displays the header with no border |
| Transparent Background | Specifies whether the background of the control is transparent |