Skip to main content
removeu 26 caracteres do conteúdo
Fonte Link
Sam
  • 80,8mil
  • 22
  • 73
  • 128

Não funciona porque ao usar o símbolo >, significa que o elemento alvo do hover deveria ser um filho direto, o que não é (veja esta resposta). Então removendo esse símbolo, o estilo será aplicado no elemento independentemente de ser filho direto ou não, basta apenas ser descendente, ou seja estar dentro da div em qualquer nível:

.icone_verde
{
  background:green;
  padding:25px 40px;
  color:#fff
}

.icone_verde:hover .feature-icon-text-title{
    color: red;
}

.icone_verde:hover .content{
    color: red;
}
<div class="icone_verde">
  <div class="vc_column-inner">
    <div class="wpb_wrapper">
        <div id="" class="feature-icon-text">
          <h2 class="feature-icon-text-title">ECONOMIA </h2>
          <div class="content">Pague sempre o mínimo</div>
        </div>
    </div>
  </div>
</div>

Não funciona porque ao usar o símbolo >, significa que o elemento alvo do hover deveria ser um filho direto, o que não é (veja esta resposta). Então removendo esse símbolo, o estilo será aplicado no elemento independentemente de ser filho direto ou não, basta apenas ser descendente, ou seja estar dentro da div em qualquer nível:

.icone_verde
{
  background:green;
  padding:25px 40px;
  color:#fff
}

.icone_verde:hover .feature-icon-text-title{
    color: red;
}

.icone_verde:hover .content{
    color: red;
}
<div class="icone_verde">
  <div class="vc_column-inner">
    <div class="wpb_wrapper">
        <div id="" class="feature-icon-text">
          <h2 class="feature-icon-text-title">ECONOMIA </h2>
          <div class="content">Pague sempre o mínimo</div>
        </div>
    </div>
  </div>
</div>

Não funciona porque ao usar o símbolo >, significa que o elemento alvo do hover deveria ser um filho direto, o que não é. Então removendo esse símbolo, o estilo será aplicado no elemento independentemente de ser filho direto ou não, basta apenas ser descendente, ou seja estar dentro da div em qualquer nível:

.icone_verde
{
  background:green;
  padding:25px 40px;
  color:#fff
}

.icone_verde:hover .feature-icon-text-title{
    color: red;
}

.icone_verde:hover .content{
    color: red;
}
<div class="icone_verde">
  <div class="vc_column-inner">
    <div class="wpb_wrapper">
        <div id="" class="feature-icon-text">
          <h2 class="feature-icon-text-title">ECONOMIA </h2>
          <div class="content">Pague sempre o mínimo</div>
        </div>
    </div>
  </div>
</div>

adicionou 77 caracteres ao conteúdo
Fonte Link
Sam
  • 80,8mil
  • 22
  • 73
  • 128

Não funciona porque ao usar o símbolo >, significa que o elemento a seguiralvo do hover deveria ser um filho direto, o que não é (veja esta resposta). Então removendo esse símbolo, o estilo será aplicado no elemento independentemente de ser filho direto ou não, basta apenas ser descendente, ou seja estar dentro da div em qualquer nível:

.icone_verde
{
  background:green;
  padding:25px 40px;
  color:#fff
}

.icone_verde:hover .feature-icon-text-title{
    color: red;
}

.icone_verde:hover .content{
    color: red;
}
<div class="icone_verde">
  <div class="vc_column-inner">
    <div class="wpb_wrapper">
        <div id="" class="feature-icon-text">
          <h2 class="feature-icon-text-title">ECONOMIA </h2>
          <div class="content">Pague sempre o mínimo</div>
        </div>
    </div>
  </div>
</div>

Não funciona porque ao usar o símbolo >, significa que o elemento a seguir deveria ser um filho direto, o que não é. Então removendo esse símbolo, o estilo será aplicado no elemento independentemente de ser filho direto ou não, basta apenas ser descendente:

.icone_verde
{
  background:green;
  padding:25px 40px;
  color:#fff
}

.icone_verde:hover .feature-icon-text-title{
    color: red;
}

.icone_verde:hover .content{
    color: red;
}
<div class="icone_verde">
  <div class="vc_column-inner">
    <div class="wpb_wrapper">
        <div id="" class="feature-icon-text">
          <h2 class="feature-icon-text-title">ECONOMIA </h2>
          <div class="content">Pague sempre o mínimo</div>
        </div>
    </div>
  </div>
</div>

Não funciona porque ao usar o símbolo >, significa que o elemento alvo do hover deveria ser um filho direto, o que não é (veja esta resposta). Então removendo esse símbolo, o estilo será aplicado no elemento independentemente de ser filho direto ou não, basta apenas ser descendente, ou seja estar dentro da div em qualquer nível:

.icone_verde
{
  background:green;
  padding:25px 40px;
  color:#fff
}

.icone_verde:hover .feature-icon-text-title{
    color: red;
}

.icone_verde:hover .content{
    color: red;
}
<div class="icone_verde">
  <div class="vc_column-inner">
    <div class="wpb_wrapper">
        <div id="" class="feature-icon-text">
          <h2 class="feature-icon-text-title">ECONOMIA </h2>
          <div class="content">Pague sempre o mínimo</div>
        </div>
    </div>
  </div>
</div>

Fonte Link
Sam
  • 80,8mil
  • 22
  • 73
  • 128

Não funciona porque ao usar o símbolo >, significa que o elemento a seguir deveria ser um filho direto, o que não é. Então removendo esse símbolo, o estilo será aplicado no elemento independentemente de ser filho direto ou não, basta apenas ser descendente:

.icone_verde
{
  background:green;
  padding:25px 40px;
  color:#fff
}

.icone_verde:hover .feature-icon-text-title{
    color: red;
}

.icone_verde:hover .content{
    color: red;
}
<div class="icone_verde">
  <div class="vc_column-inner">
    <div class="wpb_wrapper">
        <div id="" class="feature-icon-text">
          <h2 class="feature-icon-text-title">ECONOMIA </h2>
          <div class="content">Pague sempre o mínimo</div>
        </div>
    </div>
  </div>
</div>