
Contact Form 7 CSS Markup
Contact Form 7 CSS Markup
Snippet options
Download: Download snippet as contact-form-7-css-markup.less.
Copy snippet: For this you need a free my code stock.com account.
Embed code : You will find the embed code for this snippet at the end of the page, if you want to embed it into a website or a blog!
.wpcf7 { margin-top: 30px; form.wpcf7-form { width: 260px; margin: 0 auto; p { span.required { color: red; } } /* Bootstrap Plugin CF7*/ .form-group { label { .block; span.required { color: red; } } input[type="text"] { width: 100%; font-size: 16px; border: 1px solid white; padding: 5px 0 5px 15px; margin-bottom: 15px; color: #666; .square; .noShadow; .allTrans; } input[type="text"]:focus { border-color: blue; } input[type="email"] { width: 100%; font-size: 16px; border: 1px solid white; padding: 5px 0 5px 15px; margin-bottom: 15px; color: blue; .square; .noShadow; .allTrans; } input[type="email"]:focus { border-color: blue; } textarea { width: 100%; max-width: 263px; height: 120px; font-size: 16px; border: 1px solid white; padding: 5px 0 5px 15px; color: blue; .square; } textarea:focus { border-color: basecolor; } input[type="submit"] { width: 100%; .block; padding: 10px 15px; background: blue; color: white; .noBorder; .square; .allTrans; } input[type="submit"]:hover { background: red; } } } }
Create a free my code stock.com account now.
my code stok.com is a free service, which allows you to save and manage code snippes of any kind and programming language. We provide many advantages for your daily work with code-snippets, also for your teamwork. Give it a try!
Find out more and register nowYou can customize the height of iFrame-Codes as needed! You can find more infos in our API Reference for iframe Embeds.