История: Недавно я задал вопрос, касающийся получения «растущего» эффекта на кнопке (работает как брелок), затем меня попросили применить тот же эффект к моей кнопке отправки гравитационных форм, нокажется, ничего из того, что я делаю, не работает;Я даже впал в отчаяние из-за того, что все "! Важно".
Вопрос: Не могли бы вы помочь мне понять, почему тот же CSS, который я применил к кнопкам вне форм гравитации, кажется,работать, хотя это не так, когда я применяю его к кнопке внутри гравитационных форм?
Как это должно выглядеть: Найдите ссылку ниже, чтобы увидеть, как мне нужно, чтобы кнопка выглядела (только«растущий» эффект) после применения приведенного ниже CSS.
Округление фонового изображения кнопки
body .gform_wrapper .gform_footer input[type=submit] {
color: #000;
background: #fdc900;
}
body .gform_wrapper .gform_footer input[type=submit] {
z-index:99 !important;
text-decoration:none !important;
transition:color 1s !important;
position: relative !important;
display: inline-block !important;
padding: 15px 70px !important;
border: 1px solid #fdc900 !important;
border-radius:50px !important;
position:relative !important;
}
body .gform_wrapper .gform_footer input[type=submit]:hover:after{
width:100% !important;
}
body .gform_wrapper .gform_footer input[type=submit]:hover{
color:red !important;
}
body .gform_wrapper .gform_footer input[type=submit]:after{
width:0% !important;
transition: width 1s !important;
height:100% !important;
z-index:-1 !important;
content:"" !important;
position:absolute !important;
border-radius:50px !important;
top:0 !important;
left:50% !important;
transform:translateX(-50%) !important;
background-image: linear-gradient(#fdc100, #fdc100) !important;
}
<input type="submit" id="gform_submit_button_2" class="gform_button buttonCustom-Button" value="GET QUALIFIED NOW" tabindex="59" onclick="if(window["gf_submitting_2"]){return false;} window["gf_submitting_2"]=true; " onkeypress="if( event.keyCode == 13 ){ if(window["gf_submitting_2"]){return false;} window["gf_submitting_2"]=true; jQuery("#gform_2").trigger("submit",[true]); }">