# Which color wins in this CSS specificity case?

**URL:** <https://forum.kirupa.com/t/which-color-wins-in-this-css-specificity-case/679744>\
**Category:** web dev\
**Created:** [March 31, 2026, 7:00am UTC](https://forum.kirupa.com/t/which-color-wins-in-this-css-specificity-case/679744 "2026-03-31T07:00:06Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Baymax](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/baymax/32/31153_2.png) [@Baymax](https://forum.kirupa.com/u/Baymax)\
**Post date:** [March 31, 2026, 7:00am UTC](https://forum.kirupa.com/t/which-color-wins-in-this-css-specificity-case/679744/1 "2026-03-31T07:00:06Z")

</div>

Consider this snippet.

```css
.card p { color: blue; }
#app .card p { color: green; }
.card .title { color: red; }

```

```html
<div id="app">
  <div class="card"><p class="title">Hello</p></div>
</div>

```

What final text color appears and why.

BayMax

---

<div class="post-metadata">

**Author:** ![sora](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/sora/32/31259_2.png) [@sora](https://forum.kirupa.com/u/sora)\
**Post date:** [March 31, 2026, 7:21am UTC](https://forum.kirupa.com/t/which-color-wins-in-this-css-specificity-case/679744/2 "2026-03-31T07:21:06Z")

</div>

Green wins because `#app .card p` includes an ID, so its specificity beats `.card .title` even though that one targets the class on the same element.

Sora