Contact Form Clearfix blocking Footer
-
Hi there,
I’ve added a Contact form to my site, and it looks good. Unfortunately, I’ve found the Clearfix seems to not be closing properly, and causes my footer to disappear. I know it’s the contact form, as when I remove the form, the footer returns.
This is the custom CSS for the form (which I copied from another support topic, so please let me know if this is causing the issue and how to fix it).
#responsive-form{ margin:0 auto; width:100%; } .form-row{ width: 100%; } .column-half, .column-full{ float: left; position: relative; padding: 0.65rem; width:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .clearfix:after { content: ""; display: table; clear: none; } /**---------------- Media query ----------------**/ @media only screen and (min-width: 48em) { .column-half{ width: 50%; } } .wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 textarea { width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 3px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .wpcf7 input[type="text"]:focus{ background: #fff; } .wpcf7-submit{ background: #cc2a2a !important; float: left !important; color: #fff; text-transform: uppercase; border: none; margin: 0px 20px 18px 20px !important; cursor: pointer; } .wpcf7-submit:hover{ background: #ff0000; } span.wpcf7-not-valid-tip{ text-shadow: none; font-size: 12px; color: #fff; background: #ff0000; padding: 5px; } div.wpcf7-validation-errors { text-shadow: none; border: transparent; background: #f9cd00; padding: 5px; color: #9C6533; text-align: center; margin: 0; font-size: 12px; } div.wpcf7-mail-sent-ok{ text-align: center; text-shadow: none; padding: 5px; font-size: 12px; background: #59a80f; border-color: #59a80f; color: #fff; margin: 0; }
The page I need help with: [log in to see the link]
- The topic ‘Contact Form Clearfix blocking Footer’ is closed to new replies.