1

Подскажите пожалуйста, почему при использовании свойства box-shadow вышла тонкая светлая обводка вокруг элемента?

.form-sort__radio {
  display: block;
  padding-left: 30px;
  position: relative;
  margin-bottom: 20px;
  margin-left: 500px;
}
.form-sort__radio-input {
  display: none;
}
.form-sort__radio::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 15px;
  height: 15px;
  border: 3px solid #b8b8b8;
  border-radius: 100%;
}
.form-sort__radio-input:checked + .form-sort__radio::before {
  background: #000;
  box-shadow: inset 0 0 0 4px #fff, inset 0 0 100px #b8b8b8;
}
<input class="form-sort__radio-input" type="radio" name="site" value="adaptive" id="adaptive">
<label for="adaptive" class="form-sort__radio">Адаптивная</label>

<input class="form-sort__radio-input" type="radio" name="site" value="fixed" id="fixed">
<label for="fixed" class="form-sort__radio">Фиксированная</label>

<input class="form-sort__radio-input" type="radio" name="site" value="rubber" id="retina">
<label for="retina" class="form-sort__radio">Резиновая</label>

Пример на codepen.

1 ответ 1

1

По тому что box-shadow задает две внутренние тени, белого цвета и серого, поменьше белого идет первая от внутреннего края элемента и вторая серая побольше идет после нее.

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.