WordPress.org

1. swvc
   Member
   Posted 10 months ago #
   

   I have created a contact form using this amazing plugin and have also used Really simple captcha to help prevent spam. However the captcha boxes seem to put in a linebreak automatically so I cannot place both the Captcha image and the response box, along with some basic text saying "Enter code here" on one line. I know this seems really trivial but it just doesn't look as good and I would love to know how I could fix this.

   Much thanks in advance!

   P.s. Below is a link to the page in question.
   http://coppinger.co.uk/contact/

   http://wordpress.org/extend/plugins/contact-form-7/

2. Takayuki Miyoshi
   Member
   Plugin Author
   Posted 10 months ago #
   

   What did you put in the Form textarea in CF7's admin panel?

3. swvc
   Member
   Posted 10 months ago #
   

   <p>Your Name (required)
   [text* your-name] </p>

   <p>Your Email (required)
   [email* your-email] </p>

   <p>Subject: [text* your-subject] </p>

   <p>Your Message
   [textarea* your-message] </p>

   <p> Enter code here: [captchar captcha-315 4/4] [captchac captcha-315 fg:#000000 bg:#ffffff size:m]</p>

   <p>[submit "Send"]</p>

   This is what it is currently set to, yet it persists in not allowing both the captcha image and the form to type it in on the same line. So I cannot get a line like this:

   Enter code here: [CAPTCHA RESPONSE] [CAPTCHA IMAGE]

   It ends up looking like this:
   Enter code here: [CAPTCHA RESPONSE]
   [CAPTCHA IMAGE]

   Thank you very much for the quick response Takayuki, and for your work making these amazing plugins!

4. Takayuki Miyoshi
   Member
   Plugin Author
   Posted 10 months ago #
   

   In your stylesheet
   http://coppinger.co.uk/wp-content/uploads/headway/cache/general-226554b.css?ver=3.4.1
   there is:

   input[type="text"], input[type="password"], input[type="email"], textarea, select {
   border: 1px solid #CCC;
   padding: 6px 4px;
   outline: none;
   -moz-border-radius: 2px;
   -webkit-border-radius: 2px;
   border-radius: 2px;
   color: #777;
   display: block;
   background: white;
   box-sizing: border-box;
   -moz-box-sizing: border-box;
   }

   The 'display: block;' property is making the input fields blocks, not inline. Remove it if not necessary.

5. swvc
   Member
   Posted 10 months ago #
   

   That fixed it perfectly. Thank you so much, especially for the quick and concise responses for such a tiny issue. (I am sure that you have lots of more important things to be doing so thanks for taking the time to help!)

   All the best,

   SWVC

Reply

You must log in to post.