Daily Shaarli

All links of one day in a single page.

Previous day

January 26, 2021

Next day

10 CSS Tricks You Need to Know About (Part 2) | by Before Semicolon | Jan, 2021 | Medium
thumbnail

2 — Text tooltips

https://codepen.io/beforesemicolon/pen/BaKLeRL

6 — Extend the clickable area

The following example simply extends the type circle dot button click area by 2(two) by positioning a pseudo-element on top and centered.

8 — Frosted glass effect

.container {
   background-color: rgba(255, 255, 255, .15);
   backdrop-filter: blur(5px);
}

9 — Image grid with random height (Mansory Layout)

This is the famous Pinterest layout that you can use the old column property to accomplish quite easily.

10 — Math with Calc

Nothing in this world requires no math and the CSS calc function is magical.