You are viewing limited content. For full access, please sign in.

Question

Question

Change background color of text box in forms

asked on February 12, 2021

Hello,

I would like to change the color of a the background of a multi-line text box. I don't wish to do all of the text boxes in the form, just individual ones.

 

Does anyone know how to do this?

0 0

Replies

replied on February 12, 2021 Show version history

Here's some CSS you can add to your form.  Then just add the CSS Class name (in this example, red, orange, yellow, green, blue, or purple) to the individual fields you want to have color background.

The input option will get most fields like single-line, currency, etc.

The select option is for drop-down fields.

The textarea option will get the multi-line fields.

.red input, .red select, .red textarea { 
  color : white;
  background-color : red;
  border-width : 1px; 
  border-color : #A9A9A9; 
} 

.blue input, .blue select, .blue textarea { 
  color : white;
  background-color : blue;
  border-width : 1px; 
  border-color : #A9A9A9; 
} 

.green input, .green select, .green textarea { 
  color : white;
  background-color : green;
  border-width : 1px; 
  border-color : #A9A9A9; 
} 

.orange input, .orange select, .orange textarea { 
  color : black;
  background-color : orange;
  border-width : 1px; 
  border-color : #A9A9A9; 
} 

.yellow input, .yellow select, .yellow textarea { 
  color : black;
  background-color : yellow;
  border-width : 1px; 
  border-color : #A9A9A9; 
} 

.purple input, .purple select, .purple textarea { 
  color : white;
  background-color : purple;
  border-width : 1px; 
  border-color : #A9A9A9; 
} 

To set-up different colors, just change the color names or use color codes (example: #FF0000 is red).

Here's a website with lots of color options: https://www.w3schools.com/colors/colors_names.asp

1 0
replied on February 12, 2021

To select which color you want for each field, open the field settings, go to the advanced tab, and put the CSS class in that CSS input. For example, for the .red CSS class above, put "red" in the CSS input. 

1 0
You are not allowed to follow up in this post.

Sign in to reply to this post.