Publicado em 9 de mai.

Div cresce por igual

Boa tarde galera, um cliente me pediu um site exatamente como esse http://www.probuildcivil.com.au/

Eu to chegando la, ja que o codigo dele não é muito complicado, o que ta pegando é que esse botão que cresce azuis, não to conseguindo o mesmo resultado, coloquei webtransition, mas não consigo alcanças esse efeito de crescer para todos os lados, Site como ta ficando: http://jaterraplenagem.com/ não achei nenhuma forma do top crescer junto, se alguém souber de que forma eu consigo fazer o botão crescer exatamente como esse ficaria muito feliz com a ajuda.

Discussão (2)

Entre ou cadastre-se para participar da discussão

Entrar Criar conta

baguera13· 9 de mai.

Lek, vê se isso ajuda:

section.section-sub-features .orange-feature {

 -webkit-transition: all 0.2s cubic-bezier(0.835, 0, 0.19, 1);
 -moz-transition: all 0.2s cubic-bezier(0.835, 0, 0.19, 1);
 -o-transition: all 0.2s cubic-bezier(0.835, 0, 0.19, 1);
 transition: all 0.2s cubic-bezier(0.835, 0, 0.19, 1);
 -webkit-transform: scale(1);
 -moz-transform: scale(1);
 -ms-transform: scale(1);
 -o-transform: scale(1);
 transform: scale(1);
 background-color: #007ac0;
 width: 25%;
 border-top: 3px solid #007ac0;
}

section.section-sub-features .orange-feature a {

 display: block;
 padding: 10px 30px 30px 30px;
}

section.section-sub-features .orange-feature:hover {

 -webkit-transform: scale(1.1);
 -moz-transform: scale(1.1);
 -ms-transform: scale(1.1);
 -o-transform: scale(1.1);
 transform: scale(1.1);
 -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
 -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
 box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
 border-top: 3px solid #151515;
}

section.section-sub-features .orange-feature h1,
section.section-sub-features .orange-feature h1 strong {

 font-size: 80px;
 font-size: 8rem;
}

section.section-sub-features .orange-feature h1 .icon,
section.section-sub-features .orange-feature h1 strong .icon {

 text-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5), 0 0 0 #000000;
}

section.section-sub-features .orange-feature h1 em,
section.section-sub-features .orange-feature h1 strong em {

 margin-top: 10px!important;
}

section.section-sub-features .orange-feature h4,
section.section-sub-features .orange-feature h4 strong {

 color: #ffffff;
 font-size: 20px;
 font-size: 2.0rem;
 line-height: 1.1em;
 text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.3);
}

section.section-sub-features .orange-feature em {

 font-style: normal;
 color: #0067a2;

mauricio lanner· 9 de mai.

vc só fez copiar o codigo original man, isso eu ja fiz

Foi mau man, eu estava copiando o codigo erronicamente

-webkit-transform: scale(1.1);
 -moz-transform: scale(1.1);
 -ms-transform: scale(1.1);
 -o-transform: scale(1.1);
 transform: scale(1.1);
 -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
 -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
 box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
 border-top: 3px solid #151515;

resolvel