Почему не работает transition?

Question

[sfnx]

<div class="botton_section_1">
	<a href="#">DOWNLOAD MY CV</a>
</div>

.botton_section_1
	height: 48px
	width: 243px
	border: 1px solid #4d4d4d
	display: -webkit-flex
	display: -moz-flex
	display: -ms-flex
	display: -o-flex
	display: flex
	justify-content: center
	align-items: center
	transition: 0.1s
	margin-top: 35px
	&:hover
		background-color: #fff
		border: none
		cursor: pointer
		box-shadow: 0 0 25px rgba(0,0,0,0.2)
	a
		font-size: 16px
		color: #4d4d4d
		font-weight: 600

Comments

[Froggyweb]

не указано чего transition
если все то пиши transition: all .1s

[Ankhena]

Просто 0.1s это очень мало..
Всё у вас работает (ну дергается немножко, но думаю, с этим вы разберетесь)
https://codepen.io/anon/pen/EeBpWR

Answer 1

[Dymok]

А если указать transition: all 0.3s и задать все стили из блока hover в основном блоке с другими значениями?

Answer 2

[Adik Izat]

transition потавьте у hover эффекта. А то у вас транзишн применяется только при загрузке страницы, вы даже заметить не успеете.

&:hover{
transition: 0.1s;
}

Comments

[Ankhena]

transition пишется для начального состояния