Jump to content
Sign in to follow this  
mauricio lanner

Div cresce por igual

Recommended Posts

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.

Share this post


Link to post
Share on other sites

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;

Share this post


Link to post
Share on other sites

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

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.