CSS Foundations (Transitions and Transforms Transitions) - WebKit Only - Code Challenge

I have to agree with Michael K. on this one. This particular lesson did not flow like the others. More code examples can be given in the video to help troubleshoot, problem-solve, or the self-discovery process. This is one the few times the answer was nebulas. That's what generating "I've been stuck here too long, from the students/users..." comments.

I think it should be considered that "hinting" does not help the student compared to repetition. "Hinting" when all of the student's mental or educational resources have been exhausted (granted it could be all in the student's head) is frustrating and will lead to quitting or a "I give up moment".

I have plenty "Aha!" moments since joining, this time it felt like war versus the pleasurable moments I have felt. I used W3C Schools to find others examples, of the "-webkit-transition-property: ;" ... That is when the "Aha!" moment occurred, and the information became permanently ingrained into my long-term (and working) memory at that time.

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

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

How do you declare the property to the box?

this question took me way too long lol i know they we should use the shorthand version but if individually we doing it right it should be able to work...

My code is not working.

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

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

Figured it out.

Hey, here is my code. it looks right to me but i must be going wrong somewhere. please help me, i've been stuck for ages.

.box {
    border-radius: 15px;
    background: #4682B4;
  -webkit-transition-property:border-radius ; 
  -webkit-transition-duration: 2s,
  -webkit-transition-delay: 1s;
  -webkit-transition-timing-function:1s;
  -webkit-transition: linear;
 }

I'm sure I'm making the same mistake as the other people here, but any guidance is much appreciated. I've tried switching out the transition property for the class the directions want affected, but that just seems redundant since it's within the class for hover anyways. Help, I've been stuck here for too long and I am getting the right effect but it won't let me pass.

-Webkit-transition-property: border-radius; -Webkit-transition-duration: 2s; -Webkit-transition-delay: 1s; -Webkit-transition-timing-function: linear;

The only way I could get it to work was to use the shorthand version of the transition property. Same values for all would not work when individually referenced.

would be helpful if the cubic bezier curve for linear would be accepted the same as just typing linear. wasted a ton of time trying to figure out why my code was "incorrect", when it just wanted linear instead of cubic-bezier(0, 0, 1, 1)

I think that some of you may be over complicating this one. All we need to do is

-webkit-transition: transition-property transition-duration transition-timing-function transition-delay*;*

Therefore, the solution to this question will be:

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

Hopefully this helps some of you.

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