Contact Form Changes

• 

  raphaelledergerber · Member · Nov 2, 2015 at 10:04 am

  • Copy link
  • Add topic to favorites

  Dear all,

  I should correct this contact form (with shortcode) as follows:

  http://ledergerber-partner.ch/kontaktformular

  1. The checkbox text in the upper part should NOT be bold (standard format)
  2. The checkboxes should be below the title (the boxes are too far left, not belox the text above and below, not in line)
  3. The checkboxes should be on the same line like text, are a bit below the text line, I had to narrow the line spaces, did that with <div style=”line-height:110%;”>
  4. The single checkbox at the bottom does not display the text: [contact-field label="Newsletter "Unternehmer-Impulse" abonnieren" type="checkbox" required="false" /]

  How exactly to edit that with CSS without having CSS skills?

  Thanks in advance for your help,
  Raphael

  The blog I need help with is: (visible only to logged in users)

• 

  sfarley85 · Member · Nov 2, 2015 at 4:18 pm

  • Copy link

  Hi there,

  Try these changes:

  .contact-form label.checkbox {
  
      font-weight: normal;
      margin-left: 20px;
  }
  
  input.checkbox {
  
      margin: 2px 0 0;
  }

  That should help with 1-3. For #4, as best I can tell there’s no label set, you may want to double check the config there. For future changes, the best way to quickly try and experiment with CSS changes is to use Chrome’s developer tools or Firefox’s Firebug. They both allow you to easily see the HTML and CSS that are generating the page, and you can try CSS changes on the fly to see how they look in your active browser session before making the changes on the server side.

  Hope this helps! If you have any questions about any of that let me know.

• 

  raphaelledergerber · Member · Nov 2, 2015 at 4:34 pm

  • Copy link

  Hi sfarley85,

  Thanks for your answer. Now some of the points are fixed.

  #2: fixed, now it’s perfect
  #3: fixed, now it’s perfect
  #4: my fault, had a text with “” in the sentence, no with «» in the sentence it works perfectly

  #1: checkbox text are still bold

  How to fix that?

  Thanks,
  Raphael

• 

  sfarley85 · Member · Nov 2, 2015 at 4:57 pm

  • Copy link

  Try adding an “!important” to the font-weight like this:

  .contact-form label.checkbox {
  
      font-weight: normal !important;
  
  }

• 

  raphaelledergerber · Member · Nov 2, 2015 at 6:56 pm

  • Copy link

  Great, sfarley85! All perfect.

  Thanks a lot for youe very appreciated help!
  Raphael