Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialgene c
13,630 PointsMy stroke-width animation is extremely abrupt
When i hover over the hammer icon, the stroke-width increases then abruptly decreases. Not sure why. I followed all the steps.
Here's my code:
.hammer-bg {
stroke: #fee16e;
}
.hammer-bg:hover {
fill: #feae6e;
stroke-width: 8px;
}
2 Answers
Steven Parker
231,198 PointsThere isn't any transition defined yet for this element. If you wanted a similar effect to what the gear does, you could add this line to your ".hammer-bg" CSS rule:
transition: .3s ease-out;
It's possible that this was intended to be shown in the video but accidentally left out. In that case, you might want to submit a bug report to the Support staff.
Steve Gallant
14,943 PointsMake sure you are hovering over the circle background, not the hammer icon itself (which is not tied to the color animation).