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

Discussion

Discussion

Change Read Only Forms Text Field Background

posted on November 27

I have searched through answers and tried multiple ways, but I can't seem to change the background colour of a read-only text field to white. This is what I have tried (amongst others):

any suggestions would be much appreciated.

0 0
replied on November 27

The following works for me

.cf-formwrap input[readonly] {
  background-color: #ffffff !important;
}

 

0 0
replied on November 27

I don't know what I'm doing wrong, but it's not working for me. Thanks for the response though.

0 0
replied on November 27

Do you have any other CSS that may be interfering?

Also, is it set as read only at the field level, a section, or the entire form/task?

0 0
replied on November 27

This is my entire css for this form: 

It's set to read-only at the field level. 

Should I be using a field other than "multi-line"?

0 0
replied on November 27

Ah, that would be the issue then. A multi-line field is perfectly fine, especially since you obviously need the space, but it is not an "input" element.

Change "input" to "textarea"

 

For reference:

  • single line, number, date, time, mail, currency = input
  • multiline = textarea
  • dropdown = select

 

Radio buttons and Checkboxes are also inputs, but they're a little more complicated.

 

On a separate note, it looks like the text is just set with a default value. If that isn't actually a field that will ever change from user inputs, you could just use custom HTML; that would remove the need to override default field styling and would also cut out an unnecessary variable.

Inside the customHTML you could do something like

<label>Next Steps:</label><p>YOUR TEXT HERE</p>

 

2 0
replied on November 27

Definitely switching to HTML - thanks! This fixed it and looks much better.

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

Sign in to reply to this post.