[TsavoParticipant]

Hello!

Wondering if you can help me with this. Trying to get my text inline with my input fields using Contact Form 7. How would I go about doing this?

Mine: http://i.imgur.com/zzfO41E.jpg
Goal: http://i.imgur.com/HEfZSH1.jpg

Current CSS for this so far:

/*************
CONTACT FORM 7
 ************/

#contact-us-bg {
   background-color: #EDEEEF; 
   border-radius: 2.5px;
}

#formbtn {
  background-color: #2BABE1;
  border-color: 2BABE1;
  color: white;
  border-radius: 6px;
  padding: 11px 22px 11px 22px;
  margin-top: 10px;
  
}

#formbtn:hover {
  background-color: #4B5A66;
  border-color: #4B5A66;
  color: white;
  border-radius: 6px;
  padding: 11px 22px 11px 22px;
}

#required-fields {
  display: inline;
  float: right;
  padding-top:20px;
}

#formbtn {
  border: 0px;
}

@media (min-width: 980px) {
#cform-7 {
    
  padding: 0px 200px 0px 200px;
}
}

Thanks in advance!

[NicoModerator]

Hi There,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

Thanks.

[TsavoParticipant]

Here you go! I’ve set it up on a staging server, as I was developing it locally.

http://paymentlogic.bausvault.com/about/contact-us/

[TsavoParticipant]

This reply has been marked as private.

[LelyModerator]

Hello Tsavo,

Thank you for giving us your site URL.
Please add the following CSS:

.page-id-29 .wpcf7 span {
    display: inline-block;
    margin-left: 20%;
    width: 64%;
}
.page-id-29 span.wpcf7-form-control-wrap.your-email{
    margin-left: 10.5%;
}
.page-id-29 span.wpcf7-form-control-wrap.your-number {
    margin-left: 9.5%;
}
.page-id-29 input#formbtn {
    margin-left: 35.5%;
}

Hope this helps.

[Author]

Posts