Change the background colour of form entry

[Phil Grant]

Hi,
I have a form that has lots of data entries and I want to target one or two fields and change their background colours to highlight them in the display and edit forms, I’ve tried adding the CSS styling in the “Field CSS” tab but it doesn’t seem to work, even with !important.
The field is a dropdown selection on the input form rather than a text input so I’ve tried
input{ background-color:#ffcccc!important; }
and
select{ background-color:#ffcccc!important; }
without success, any suggestions on how I can achieve this?

Thanks

[SteveE]

For EditForm:
In Custom JS add this
jQuery(“#dffs_Dropdown select”,”dffs_Dropdown2 select”).css(‘background-color’,’#ffcccc’);

For DispForm:
In Custom JS add this
jQuery(“#dffs_Dropdown td.ms-formbody”,”dffs_Dropdown2 td.ms-formbody”).css(‘background-color’,’#ffcccc’);

In DispForm it highlights the entire cell so you may want do change it to just ‘color’ and you’ll just change the color of the text.

[Alexander Bautz]

Hi Phil,
The code you have used should work – are you sure you have it in the correct form? – also, DispForm there are no select or input so you must style the td instead:

td{
background-color:red!important;
}

Alexander

[Phil Grant]

Thanks, I thought it would be just me not understanding how to reference something!

[Phil Grant]

Still no luck, does it matter if the field is part of an SBS?

[Alexander Bautz]

It could be, but the above code colors ALL the td’s in my test form. If you use the developer tools (right click > inspect) and look at the style section you can see all styles applied – and any styles that are overridden (shows with strikethrough).

PS: Use the new Edge Chromium or Google Chrome when debugging.

Alexander

[Author]

Posts