Support » Plugin: Contact Form 7 » CSS Styling not working

  • For the website I’m working on, I’m using multiple contact forms. On the homepage BEFORE the footer we have a sign up bar.

    Now I want the email Input field and the send button, next to each other. However I cannot seem to make it work, even when classes and ID’s are being made and assigned.

    ilovebeeing.afixwerkt.nl is the website.

    Can someone explain how to make the CSS styling work so it doesn’t change the other contact forms on the website. Aswell places the input and send button in 1 line.

    Looking forward to your replies and thanks in advance

    https://wordpress.org/plugins/contact-form-7/

Viewing 5 replies - 1 through 5 (of 5 total)
  • You can add a class to your input and submit button with a 45% width.

    [email* your-email class:YourClassName "e-mail address"]
    [submit class:YourClassName "Send"]

    in your css file :
    .YourClassName{width:45%!important}

    use the !important setting to override your theme style

    Thread Starter rafix

    (@rafix)

    Thank you for the quick reply.

    So I’ve tried that already, and It doesn’t take the class CSS I assign to it. In the HTML you will see it, however the styling that is applied does not show.

    didn’t you just add the class inputfield-signup and button-signup?
    If yes, the problem come from your css (not included in the page maybe)

    Thread Starter rafix

    (@rafix)

    I just added them, so you could see that it doesn’t work. The CSS does get included correctly into the page.

    Any other solutions for this?

    Are you sure you didn’t do any mistake in your css ?

    .inputfield-signup {width:45%!important}
    .button-signup {width:45%!important}

    I don’t see any other option, this should work.
    Else, i’m sorry but I can’t help you 🙁 Maybe try with and id instead of a class

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘CSS Styling not working’ is closed to new replies.