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 trial

CSS

Posted by Leon Kenedy
Leon Kenedy
Courses Plus Student 9,149 Points

Can you help me with this code challenge?

I need the code to this I have spent to much time reviewing the video. Here is the link,

http://teamtreehouse.com/library/websites/css-foundations-second-edition/transitions-and-transforms/transitions-webkit-only

2 Answers

Ken Alger
STAFF
Ken Alger
Treehouse Teacher
Ken Alger
Ken Alger
Treehouse Teacher

Leon;

Here is the approach I have used:

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

Good luck.

Leon Kenedy
Leon Kenedy
Courses Plus Student 9,149 Points

Thank you very much.

Samuel Stephen
Samuel Stephen
8,493 Points

I thought the shorthand was -webkit-transition: property duration timing-function delay;

My initial answer was: 

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

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

Until I saw your answer, I was racking my brain for a while.

Anyways, thank you, Ken! You're awesome.

Ken Alger
Ken Alger
Treehouse Teacher
Ken Alger
Ken Alger
Treehouse Teacher

Pleased it was a help.

Happy coding,

Ken

Makayi Lendo
Makayi Lendo
9,033 Points
Makayi Lendo
Makayi Lendo
9,033 Points

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