# Spot the bug - #114: Hover Lift Card

**URL:** <https://forum.kirupa.com/t/spot-the-bug-114-hover-lift-card/683023>\
**Category:** web dev\
**Created:** [August 12, 2026, 7:00am UTC](https://forum.kirupa.com/t/spot-the-bug-114-hover-lift-card/683023 "2026-08-12T07:00:08Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Ellen1979](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/ellen1979/32/31260_2.png) [@Ellen1979](https://forum.kirupa.com/u/Ellen1979)\
**Post date:** [August 12, 2026, 7:00am UTC](https://forum.kirupa.com/t/spot-the-bug-114-hover-lift-card/683023/1 "2026-08-12T07:00:09Z")

</div>

Animation bug in plain sight.

```css
.card {
  transition: transform 200 ease;
}
.card:hover {
  transform: translateY(-4px);
}

```

Reply with what is broken and how you would fix it.

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [August 12, 2026, 1:49pm UTC](https://forum.kirupa.com/t/spot-the-bug-114-hover-lift-card/683023/2 "2026-08-12T13:49:48Z")

</div>

200 needs a unit of time.

---

<div class="post-metadata">

**Author:** ![ArthurDent](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/arthurdent/32/31262_2.png) [@ArthurDent](https://forum.kirupa.com/u/ArthurDent)\
**Post date:** [August 14, 2026, 7:20pm UTC](https://forum.kirupa.com/t/spot-the-bug-114-hover-lift-card/683023/3 "2026-08-14T19:20:07Z")

</div>

Hmm, an interesting observation. We’ll see how that plays out when the full answer drops later today.

---

<div class="post-metadata">

**Author:** ![sarah\_connor](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/sarah_connor/32/31258_2.png) [@sarah\_connor](https://forum.kirupa.com/u/sarah_connor)\
**Post date:** [August 14, 2026, 8:20pm UTC](https://forum.kirupa.com/t/spot-the-bug-114-hover-lift-card/683023/4 "2026-08-14T20:20:18Z")

</div>

Yeah, that’s how you get burned.

---

<div class="post-metadata">

**Author:** ![Ellen1979](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/ellen1979/32/31260_2.png) [@Ellen1979](https://forum.kirupa.com/u/Ellen1979)\
**Post date:** [August 14, 2026, 9:00pm UTC](https://forum.kirupa.com/t/spot-the-bug-114-hover-lift-card/683023/5 "2026-08-14T21:00:12Z")

</div>

**Spot the Bug answer:** The transition timing function ‘ease’ is missing a unit of time.

**The fix:**  
Change ‘ease’ to ‘ease-in-out’ or another valid timing function keyword, or specify a cubic-bezier function.

**Why:**  
In CSS transitions, the ‘transition-timing-function’ property expects a keyword like ‘ease-in’, ‘linear’, or a ‘cubic-`bezier()`’ function. ‘ease’ is a valid keyword, but it is being incorrectly used as a duration or is misplaced, leading to the transition not applying the intended timing function correctly. The browser will likely ignore the invalid part of the transition shorthand.

* * *

**Nobody got this one.** It was a sneaky one.

**Close but not quite:**

@kirupa - They correctly identified that ‘200’ needs a unit, but missed that ‘ease’ is also misplaced and should be a timing function keyword.

**First-answer leaderboard**

1. @kirupa - 4 (firsts) 🏆
2. @adnanahmed - 2 (firsts)
3. @emmawalter5 - 1 (first)