Apply Custom CSS to a Single Custom Content Element

How to avoid applying a style to all Custom Content

To change the appearance of a single Custom Content block, you will need to use the "nth-child" selector.

For example:

#GF-Blocks > div:nth-child(12){

This query looks at the entire collection of Giving Form elements, then finds the 12th div element in that collection and applies the style.

So, if you wanted to adjust a Custom Content block, and that Custom Content block is the 7th element on the form, your query would look like this:

#GF-Blocks > div:nth-child(7){

Keep in mind that re-arranging form elements can affect the nth-child query.  For example, if your Custom Content was element 7, and you add an element at the top, your Custom Content block is now element 8.