Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.


Barbara Vega
Barbara Vega
Full Stack JavaScript Techdegree Student 19,486 Points

Transitions and Transforms Test

Not sure what I'm doing wrong. I've tried shorthand and long...neither work. Please help. This is what I typed

.box { border-radius: 15px; background: #4682B4; }

.box:hover { background: #F08080; border-radius: 50%; -webkit-transition-property: border-radius; -webkit-transition-duration: 2s; -webkit-transition-timing-function: linear; -webkit-transition-delay: 1s; }

Barbara, i found this awesome site for transitions: http://www.css3files.com/transition/

It's easier to understand ;)

2 Answers

You'll need to specify the element being transformed in .box as well.

Alex Lasek
Alex Lasek
11,536 Points

they asked you to add transitions to box element not to its hover state :)

.box { border-radius: 15px; background: #4682B4; -webkit-transition:border-radius 2s 1s linear; }

.box:hover { background: #F08080; border-radius: 50%;


Alex, thanks for the answer, but a minor error with the ordering:

-webkit-transitions: property duration bezier delay;

-webkit-transitions: border-radius 2s linear 1s;

Other than that, looks good to me ;)

Alex Lasek
Alex Lasek
11,536 Points

yep, you are wright. I wrote it by hart and didn't notice that I changed the order. Thanks for correction