WP联系表格7样式问题选择

时间:2018-02-08 09:19:46

标签: html css wordpress contact-form-7

我再次遇到WP&#39的联系表单插件的样式问题。

此屏幕截图显示了它的外观 - 显然,它设置为"宽度:100"但按钮居中 - 因此,它不是100%。

Contact form on my website

我用于联系表单的代码是:



/* my custom css*/

input[type=submit] {
   background: none;
   color: #1fbba6;
   border: 2px solid #1fbba6;
   border-radius: 50px !important;
   padding: 14px 14px;
   font-weight: 400;
   font-size: 12px;
	 width: 140px !important;
    }

.wpcf7 {
	    width: 100%;
}

input[type=select] {
width: 100% !important;
	color: #d9d9d9;
}

input.wpcf7-form-control.wpcf7-submit:hover {
   background: none;
   color: #1fbba6;
}

.wpcf7-form select {
width: 100% !important;
}

/* classes that are provided from my theme*/

@media screen and (-webkit-min-device-pixel-ratio: 0)
template.min.css?ver=4.15.13:1
.kl-fancy-form-select {
    height: 52px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    box-shadow: inset 1px 2px 0 rgba(0,0,0,.06);
    background-image: url(../images/select-arrow.svg);
    background-repeat: no-repeat;
    background-size: 6px 12px;
    background-position: calc(100% - 10px) 50%;
    background-position-y: center;
    background-position-x: calc(100% - 10px);
}

<label>[text* your-name placeholder "Dein Name*"] </label>

<label>[email* your-email placeholder "Deine E-Mail*"] </label>

<label>[tel phone placeholder "Telefon"]</label>

<label>[select* class:zn_form_input class:form-control--light class:kl-fancy-form-select training "Ich interessiere mich für:" "Personal Training" "Mini-Kurse" "Rückbildung" "Sonstiges"]</label>

<label>[textarea your-message placeholder "Deine Nachricht"] </label>

<center>[submit "Nachricht senden"]</center>
&#13;
&#13;
&#13;

为什么不接受我的&#34;宽度:100%!重要;&#34;?我该怎么做才能让它接受?

感谢您的帮助!

0 个答案:

没有答案