CSS Tricks That Feel Illegal But Work

Sometimes CSS feels boring.

And then you discover properties that feel like they shouldn't work...
But they do.

Here are some CSS tricks that feel illegal --- but are completely valid
and insanely useful.

---

1️⃣ pointer-events: none -- Click Through Elements

Ever wanted to put something on top of everything... but still allow
clicks underneath?

.overlay {
  pointer-events: none;
}

Now the element becomes visually present, but completely ignores mouse
interaction.

🔥 Use Cases:

• Floating gradients
• Decorative layers
• Custom cursor effects
• Non-blocking overlays

---

2️⃣ aspect-ratio -- Finally No More Padding Hacks

Remember the old padding-bottom trick for maintaining aspect ratio?
Yeah. Forget that.

.card {
  aspect-ratio: 16 / 9;
}

No wrappers. No hacks. No math.

It just works.

---

3️⃣ clamp() -- Responsive Magic in One Line

This one feels like cheating.

font-size: clamp(1rem, 2vw, 2rem);

• Minimum → 1rem\
• Preferred → 2vw\
• Maximum → 2rem

Your text now scales smoothly without media queries.

---

Final Thoughts

CSS isn't limited.
Most developers just don't explore it deeply enough.
The cleanest solutions often require less code --- not more.
Now, You know the 60% of the tricks, 40% main tricks in the next part.
Which CSS trick felt the most illegal to you?