Используйте полученные знания о тонкостях блочной модели, чтобы пройти это испытание.

Все размеры, которые вам нужно задать, кратны двадцати. Цвет рамки блока — white.

Подобрать правильные размеры вам поможет сетка на фоне. Размеры маленькой ячейки — 20 на 20 пикселей, большой ячейки — 100 на 100 пикселей.

Обратите внимание, что HTML-код заблокирован, а некоторые CSS-свойства в нём заданы в атрибуте style. Это означает, что для решения испытания вам не нужно переопределять эти свойства, а нужно принять их как ограничения.

Для прохождения испытания вам нужно:

• для .block-1 задать свойство border;
• для .block-2 — свойства margin и padding;
• а для .text-input — свойство box-sizing.

Решение

Решение испытания будет доступно через несколько минут. Используйте его, если возникнут сложности. А пока попытайтесь пройти испытание самостоятельно.

.block {
  background: rgba(0, 255, 255, 0.2);
}

.block-1 {
  border: 20px solid white;
}

.block-2 {
  padding: 20px;
  margin: 20px;
}

.text-input {
  height: 40px;
  border: none;
  padding: 0 10px;
  box-sizing: border-box;

  font-size: 18px;
  font-family: inherit;
}