This documentation page is for Quform version 1 and may not be applicable for Quform 2 click here to visit the documentation for Quform 2.

CSS styles

Single Line Text → Settings → Advanced

You can add custom CSS to any part of the element and it’s surrounding HTML to change the style.

Adding a style

To add a style, click the button that corresponds to the part of the element HTML that you would like to style, for example, to style the label, click the Label button.

To add CSS styles, click the CSS button of the newly added style to show the box where you can add CSS. Now enter the styles without the CSS selector or curly brackets and each line must end in a semi-colon. For example:

1
2
3
border: 1px solid #222;
font-size: 15px;
margin-right: 4px;
border: 1px solid #222;
font-size: 15px;
margin-right: 4px;

Once you save the form, the changes will appear on the form on your website.

Removing a style

To remove a style, click the remove icon on the style.

CSS selectors

Single Line Text → Settings → Advanced

Each element in your form has unique class selectors that you can use to style the element individually. These selectors are shown in this section, just copy the selector and paste it into your theme CSS file to add a style to that part of the element.

Be inspired. © 2024 ThemeCatcher Ltd. 20-22 Wenlock Road, London, England, N1 7GU | Company No. 08120384 | Built with React | Privacy Policy