Title: Styling the input fields
Last modified: April 19, 2023

---

# Styling the input fields

 *  Resolved [klauswildenburg](https://wordpress.org/support/users/klauswildenburg/)
 * (@klauswildenburg)
 * [3 years, 1 month ago](https://wordpress.org/support/topic/styling-the-input-fields/)
 * Hello everyone,
 * I need help designing the input fields of ‘site_review_form’. I know a little
   about CSS. But I can’t find out the correct classes (selectors) of the fields.
   I didn’t find anything in the forum. Can someone give me examples?
 * I’m using the Divi Theme and in Site Review’s settings I’ve set the value of 
   the ‘Plugin Style’ field to ‘Divi (v4).
 * Thank you, Klaus.
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fstyling-the-input-fields%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 10 replies - 1 through 10 (of 10 total)

 *  Plugin Author [Gemini Labs](https://wordpress.org/support/users/geminilabs/)
 * (@geminilabs)
 * [3 years, 1 month ago](https://wordpress.org/support/topic/styling-the-input-fields/#post-16673123)
 * In this example I am using Firefox, but you can do the same with any browser.
 * Right-click the field and click Inspect. This will open the browser’s Web Inspector.
 * ![](https://i0.wp.com/i.imgur.com/z7IRegq.png?ssl=1)
 * In the Inspector you can see which CSS classes are being used for the element
   you inspected.
 * The Web Inspector also has a button in the toolbar that you can use to hover 
   over and click anything on the page which will highlight it in the Inspector.
   From there, you can see the CSS classes that are being used.
 * ![](https://i0.wp.com/i.imgur.com/BwpRwyG.png?ssl=1)
 * Once you know the CSS classes, you can use them in your own CSS to modify the
   way the form looks.
 *  Thread Starter [klauswildenburg](https://wordpress.org/support/users/klauswildenburg/)
 * (@klauswildenburg)
 * [3 years, 1 month ago](https://wordpress.org/support/topic/styling-the-input-fields/#post-16673303)
 * Thank you for this detailed answer !!! This way I know that I was on the right
   track in my past attempts.
 * I have entered the following examples into the style.css of my divi-child theme:
 * .glsr input {
    background: green;}
 * site-reviews-title-glsr_abd209fe {
    background: green;}
 * Unfortunately, the background color of the input fields/the input field does 
   not change. Is the problem 50 cm in front of my computer? … do I have to go to
   the optician ?
 * ![](https://i0.wp.com/www.tagespflege-rasselbande.de/wp-content/uploads/2023/
   04/2023-04-20_190843.jpg)
 *  Plugin Author [Gemini Labs](https://wordpress.org/support/users/geminilabs/)
 * (@geminilabs)
 * [3 years, 1 month ago](https://wordpress.org/support/topic/styling-the-input-fields/#post-16673314)
 * You are probably having issues due to [CSS specificity](https://css-tricks.com/specifics-on-css-specificity/).
   What is the URL?
 *  Thread Starter [klauswildenburg](https://wordpress.org/support/users/klauswildenburg/)
 * (@klauswildenburg)
 * [3 years, 1 month ago](https://wordpress.org/support/topic/styling-the-input-fields/#post-16673324)
 * [https://www.tagespflege-rasselbande.de/home/](https://www.tagespflege-rasselbande.de/home/)
 * At the bottom of the page. Page looks bit confused because it’s in progress.
 *  Thread Starter [klauswildenburg](https://wordpress.org/support/users/klauswildenburg/)
 * (@klauswildenburg)
 * [3 years, 1 month ago](https://wordpress.org/support/topic/styling-the-input-fields/#post-16673384)
 * Of course I meant with #:
 * **#**site-reviews-title-glsr_abd209fe {
 * background: green;
 * }
 *  Plugin Author [Gemini Labs](https://wordpress.org/support/users/geminilabs/)
 * (@geminilabs)
 * [3 years, 1 month ago](https://wordpress.org/support/topic/styling-the-input-fields/#post-16673915)
 * Try this:
 *     ```wp-block-code
       .glsr-form .glsr-input,
       .glsr-form .glsr-textarea{
           background-color: #B2D4CC;
           border-radius: 10px;
       }
       ```
   
 *  Thread Starter [klauswildenburg](https://wordpress.org/support/users/klauswildenburg/)
 * (@klauswildenburg)
 * [3 years, 1 month ago](https://wordpress.org/support/topic/styling-the-input-fields/#post-16673944)
 * I put in your code into style.css of Divi Child Theme:
 * .glsr-form .glsr-input,
   .glsr-form .glsr-textarea{border-radius: 10px;background-
   color: #B2D4CC;}
 * I cleared Cache of Divi (Theme Options > Builder > Advanced > Static CSS File
   Generation > ‘CLEAR’ … and saved it)
   I cleared the Browser Cache of Microsoft
   EdgeI loaded the page ‘[http://www.tagespflege-rasselbande.de/home/&#8217](http://www.tagespflege-rasselbande.de/home/&#8217);
   with Edge –> Radius and backround didn’t change 🙁
 * I installed Firefox and loaded the page ‘[http://www.tagespflege-rasselbande.de/home/&#8217](http://www.tagespflege-rasselbande.de/home/&#8217);
   in Firefox –> Radius and backround didn’t change 🙁
 *  Thread Starter [klauswildenburg](https://wordpress.org/support/users/klauswildenburg/)
 * (@klauswildenburg)
 * [3 years, 1 month ago](https://wordpress.org/support/topic/styling-the-input-fields/#post-16673947)
 * Did you try to create your own example? … embed the shortcode in a divi text 
   module and tried to make adjustments ?
 *  Plugin Author [Gemini Labs](https://wordpress.org/support/users/geminilabs/)
 * (@geminilabs)
 * [3 years, 1 month ago](https://wordpress.org/support/topic/styling-the-input-fields/#post-16673954)
 *     ```wp-block-code
       .glsr-divi .glsr-input,
       .glsr-divi .glsr-textarea {
           background-color: #B2D4CC;
           border-radius: 10px;
       }
       ```
   
 * ![](https://i0.wp.com/i.imgur.com/8j4f9TG.png?ssl=1)
 *  Thread Starter [klauswildenburg](https://wordpress.org/support/users/klauswildenburg/)
 * (@klauswildenburg)
 * [3 years, 1 month ago](https://wordpress.org/support/topic/styling-the-input-fields/#post-16675336)
 * Thank you so much, that works fine.
 * Your support is really great. So my £30 donation a few days ago was a good investment!

Viewing 10 replies - 1 through 10 (of 10 total)

The topic ‘Styling the input fields’ is closed to new replies.

 * ![](https://ps.w.org/site-reviews/assets/icon-256x256.gif?rev=3307009)
 * [Site Reviews](https://wordpress.org/plugins/site-reviews/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/site-reviews/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/site-reviews/)
 * [Active Topics](https://wordpress.org/support/plugin/site-reviews/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/site-reviews/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/site-reviews/reviews/)

## Tags

 * [input](https://wordpress.org/support/topic-tag/input/)
 * [style](https://wordpress.org/support/topic-tag/style/)

 * 10 replies
 * 2 participants
 * Last reply from: [klauswildenburg](https://wordpress.org/support/users/klauswildenburg/)
 * Last activity: [3 years, 1 month ago](https://wordpress.org/support/topic/styling-the-input-fields/#post-16675336)
 * Status: resolved