Title: Fields Inline w/ Asterisks & Custom CSS
Last modified: August 21, 2016

---

# Fields Inline w/ Asterisks & Custom CSS

 *  Resolved [corepath](https://wordpress.org/support/users/corepath/)
 * (@corepath)
 * [12 years, 7 months ago](https://wordpress.org/support/topic/fields-inline-w-asterisks-custom-css/)
 * Hi,
 * Great plugin, I really am looking forward to using it and have the forms embedded
   rather than linked.
 * My issue is that:
    a) I’d like to have the fields inline with the asterisk for
   required questions rather than below them — it makes it confusing to which field
   is for which question otherwise (in my case) b) Is there still a custom CSS box?
   I have been editing the CSS file? c) For the redirect page, should it be a custom
   page or how would we go about getting the confirmation page from Google Forms?
 * Cheers and thanks!
 * [http://wordpress.org/plugins/wpgform/](http://wordpress.org/plugins/wpgform/)

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

 *  Plugin Author [Mike Walsh](https://wordpress.org/support/users/mpwalsh8/)
 * (@mpwalsh8)
 * [12 years, 7 months ago](https://wordpress.org/support/topic/fields-inline-w-asterisks-custom-css/#post-4062795)
 * a) Definitely achievable – likely will require some custom CSS based on your 
   theme.
 * b) Yes. In fact there is a “global” CSS box as part of the plugin settings which
   is applied to all forms when Custom CSS is enabled. There is also a Custom CSS
   box for each form to include form specific CSS.
 * c) If you don’t do anything special you’ll end up with the Goolge confirmation
   page after submitting the form.
 *  Thread Starter [corepath](https://wordpress.org/support/users/corepath/)
 * (@corepath)
 * [12 years, 7 months ago](https://wordpress.org/support/topic/fields-inline-w-asterisks-custom-css/#post-4062806)
 * Hmm okay, so it’s my theme that’s causing the fields not to display inline with
   the asterisks? Any idea on what CSS might fix that?
 * I tried entering the custom CSS in the ‘CSS Class’ box on the form but it didn’t
   work and ended up editing the core CSS file.
 * Any thoughts? Thanks for the quick response as well!
 *  Plugin Author [Mike Walsh](https://wordpress.org/support/users/mpwalsh8/)
 * (@mpwalsh8)
 * [12 years, 7 months ago](https://wordpress.org/support/topic/fields-inline-w-asterisks-custom-css/#post-4062825)
 * The appearance is almost always due to the WordPress theme currently being used
   because none of Google’s CSS is brought through the process, just the HTML that
   makes up the form.
 * If you can post a URL to your page, I can look at it for you and make some suggestions.
   If you don’t want to post it here on the forum you can fill out my [Help and Support form](http://michaelwalsh.org/wordpress/wordpress-plugins/wpgform/help-and-support/)
   and I’ll take a look when I see the email.
 * There really is no reason to edit the plugin’s core CSS file.
 *  Thread Starter [corepath](https://wordpress.org/support/users/corepath/)
 * (@corepath)
 * [12 years, 7 months ago](https://wordpress.org/support/topic/fields-inline-w-asterisks-custom-css/#post-4062891)
 * Okay, the code I entered was:
 *     ```
       div.ss-form-entry > input { width: 50%; }
       div.ss-form-entry > textarea { width: 100%; }
   
       div.required-message {
           display: none;
       }
       ```
   
 *  and when I put that in the CSS Class box nothing happened so I edited the .css
   file.
 * URL: [http://www.talonx.com/website-starting-checklist/](http://www.talonx.com/website-starting-checklist/)
 * Thanks,
 *  Plugin Author [Mike Walsh](https://wordpress.org/support/users/mpwalsh8/)
 * (@mpwalsh8)
 * [12 years, 7 months ago](https://wordpress.org/support/topic/fields-inline-w-asterisks-custom-css/#post-4062894)
 * You need to add this to the custom CSS file:
 * div.ss-q-title label {
    display: inline; }
 * Your theme has “display” set to “block” for “label” elements. The above will 
   override it within the context of a Google Form.
 *  Thread Starter [corepath](https://wordpress.org/support/users/corepath/)
 * (@corepath)
 * [12 years, 7 months ago](https://wordpress.org/support/topic/fields-inline-w-asterisks-custom-css/#post-4062895)
 * Thanks, much appreciated!
 * Is there any way to add a space between the field and the question below or a
   br tag? The option on the back end put it between question and answer, I’d like
   it below the answer and the next question.
 * Cheers,
 *  Plugin Author [Mike Walsh](https://wordpress.org/support/users/mpwalsh8/)
 * (@mpwalsh8)
 * [12 years, 7 months ago](https://wordpress.org/support/topic/fields-inline-w-asterisks-custom-css/#post-4062896)
 * You can mess with the margin and/or padding properties. Something like this will
   make it spread out.
 *     ```
       .ss-q-title {
           margin-top: 10px;
       }
       ```
   
 * The Google Forms have a slew of CSS classes so if you know CSS pretty well, there
   isn’t much you can’t do to affect the appearance of your form. I find a tool 
   like Firebug invaluable for figuring these things out. It lets you make changes
   inline and see the result so you don’t have to update your CSS, re-render the
   page, etc. You’ll know right away if you have the right CSS selector.
 * Another thing I do is use things like “border: 1px dashed red;” in my CSS temporarily
   to ensure I am selecting the thing I want to modify.
 *  Thread Starter [corepath](https://wordpress.org/support/users/corepath/)
 * (@corepath)
 * [12 years, 7 months ago](https://wordpress.org/support/topic/fields-inline-w-asterisks-custom-css/#post-4062898)
 * Thanks for all your help — much appreciated!

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

The topic ‘Fields Inline w/ Asterisks & Custom CSS’ is closed to new replies.

 * ![](https://s.w.org/plugins/geopattern-icon/wpgform_8cc59f.svg)
 * [Google Forms](https://wordpress.org/plugins/wpgform/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/wpgform/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/wpgform/)
 * [Active Topics](https://wordpress.org/support/plugin/wpgform/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/wpgform/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/wpgform/reviews/)

 * 8 replies
 * 2 participants
 * Last reply from: [corepath](https://wordpress.org/support/users/corepath/)
 * Last activity: [12 years, 7 months ago](https://wordpress.org/support/topic/fields-inline-w-asterisks-custom-css/#post-4062898)
 * Status: resolved