@Arbil

Почему не меняется цвет в контейнере?

Имеется такой код
<div class="fields">

        <div class="field__one">
          <div class="circle"><p>1</p></div>
          <div class="field__title">domain</div>
          <div class="field__description">Find the Perfect web Hosting Package for You, best  hosting services. Join now and get free domain !</div>
        </div>

        <div class="field__two">
          <div class="circle"><p>2</p></div>
          <div class="field__title">hosting</div>
          <div class="field__description">Website hosting services are basically the plot of internet land that your website storefront sits on.</div>
        </div>

        <div class="field__three">
          <div class="circle"><p>3</p></div>
          <div class="field__title">website</div>
          <div class="field__description">Customers can access and see it when they type your url.  different types of hosting services that cater to the varying types of businesses. </div>
        </div>
          </div>


.circle{
  position: relative;
  background-color: #fff;
  border-radius: 50%;
}

.circle p{
  position: absolute;
  top: 50%;
  left: 50%;
  margin-right: -50%;
  transform: translate(-50%, -50%);
  font-size: 24px;
  color:#00aeef;
}

.circle:hover{
  background: linear-gradient(to left, #9d35c0, #31aae2);
  color: #fff;
}

Как я понимаю, если указать в hover color, то цвет текста в контейнере должен поменяться, но этого не происходит. Почему? Может я что-то не так понимаю? Как изменить цвет текста при наведении на контейнер, а не на текст ?
  • Вопрос задан
  • 34 просмотра
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы