Как убрать фокус на полях формы - PullRequest
0 голосов
/ 09 мая 2019

Я создал форму и установил фокус на none, но я все еще заставляю зеленое поле появляться и оставаться вокруг каждого поля формы во время тестирования.

Вот форма: https://secureforms.nextens.nl/TEMPLATE

Я уже пробовал использовать:

*:focus {
outline: none;
 }

И

input:focus,
select:focus,
textarea:focus,
button:focus {
outline: none;
}

Но по какой-то причине это все еще не работает. Ниже приведен CSS, который я использую для стилизации формы.

input[type=text], select {
   font-size:15px;
   width: 85%;
   margin: 8px 0;
   padding-left: 10px;
   padding-top: 10px;
   padding-bottom: 10px;
   display: inline-block;
   border: 1px solid #ccc;
   border-radius: 25px;
   box-sizing: content-box;
}
.elq-form select
{
   font-size:15px;
   width: 85%;
   margin: 8px 0;
   padding-left: 10px;
   padding-top: 10px;
   padding-bottom: 10px;
   display: inline-block;
   border: 1px solid #ccc;
   border-radius: 25px;
   box-sizing: content-box;
}

.elq-form radio
{
   font-size:15px;
   width: 100%;
   margin: 8px 0;
   display: inline-block;
   border: 1px solid #ccc;
   border-radius: 25px;
   box-sizing: content-box;
}

input[type=submit] {
   width: 100%;
   background-color: #337ab7;
   color: white;
   margin-top: 8px;
   margin-bottom: 8px;
   border: none;
   border-radius: 0px;
   cursor: pointer;
}

input[type=submit]:hover {
   background-color: #337ab7;
}
input:focus,
select:focus,
textarea:focus,
button:focus {
    outline: none;
}

Я просто хочу, чтобы зеленая подсветка вокруг полей формы не отображалась.

Ответы [ 3 ]

0 голосов
/ 09 мая 2019

добавить это в свой CSS

.LV_invalid_field, input.LV_invalid_field:hover, input.LV_invalid_field:active, textarea.LV_invalid_field:hover, textarea.LV_invalid_field:active,
.LV_valid_field, input.LV_valid_field:hover, input.LV_valid_field:active, textarea.LV_valid_field:hover, textarea.LV_valid_field:active {
    outline: 0;
}
0 голосов
/ 09 мая 2019

Согласно Dev-Tools, проблема заключается в строке 7 вашего CSS:

.LV_valid_field, ...

0 голосов
/ 09 мая 2019

У вас есть этот CSS в вашем шаблоне, вы должны удалить его, чтобы получить то, что вы хотите

.LV_valid_field,
input.LV_valid_field:hover,
input.LV_valid_field:active,
textarea.LV_valid_field:hover,
textarea.LV_valid_field:active {
        outline: 1px solid #00CC00;
}

.LV_invalid_field,
input.LV_invalid_field:hover,
input.LV_invalid_field:active,
textarea.LV_invalid_field:hover,
textarea.LV_invalid_field:active {
        outline: 1px solid #CC0000;
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...