Contact form width and alignment

edited September 2015 in Theme support
Hi, I'm trying to implement a contact form (contact form 7) into my site using VC, however the form appears to cover only 1/4 of the page width. I was wondering if it would be possible to extend its width and also center it?


Thank you very much :)

Comments

  • Hi,

    please send us private message with access to this site so we can check how you did it exactly.
  • Thank you I already sent you a message. 

    By the way, I also noticed on one of the demos that it is possible to customize the contact form like in this example http://themes.muffingroup.com/be/taxi/

    I was wondering if you could help me understand how to customize it like that as well?

    Thank you :)
  • For this from, we used some custom css:
    /* Form */
    input[type="text"], input[type="tel"], input[type="password"], input[type="email"], textarea, select, .woocommerce .quantity input.qty {
        background-color: #f5f5f5; border: 2px solid #c49b2c; border-radius: 2px;
    }
    input[type="date"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="text"]:focus, input[type="url"]:focus, select:focus, textarea:focus {
        border: 2px solid #c49b2c;
    }
    .order_form input[type="submit"] { font-size: 140%; padding: 12px 40px; }
    But in from section, we used below shortcodes:
    <div class="column one">[select* car placeholder "Choose your car" "Car 1" "Car 2" "Car 3"]</div>
    <div class="column one-second">[text* from placeholder "From"]</div>
    <div class="column one-second">[text* to placeholder "To"]</div>
    <div class="column one">[textarea your-message  x4 placeholder "Message"]</div>
    <div class="column one">[submit "Order now"]</div>
Sign In or Register to comment.