A Calendar in Three Lines of CSS

This article has no byline and is on a website that is even more weirdly specific than this one is, but I appreciate the trick here. A seven-column grid makes for a calendar layout pretty quick. You can let the days (grid items) fall onto it naturally, except kick the first day over to the correct first column with grid-column-start. Thoughts:

I’d go with an rather than a just because it seems like days are definitely ordered.

… Read article “A Calendar in Three Lines of CSS”

The post A Calendar in Three Lines of CSS appeared first on CSS-Tricks. You can support CSS-Tricks by being an MVP Supporter.

https://calendartricks.com/a-calendar-in-three-lines-of-css/

Created 4y | Dec 24, 2020, 4:20:36 PM


Login to add comment

Other posts in this group

State of Devs: A Survey for Every Developer

The State of Devs survey is now open to participation, and unlike previous surveys it covers everything except code: career, workplace, but also health, hobbies, and more. 


May 1, 2025, 2:20:29 PM | CSS tricks
Revisiting Image Maps

Let’s run through a quick refresher. Image maps date all the way back to HTML 3.2, where, first, server-side maps and then client-side maps defined clickable regions over an image using map and are

Apr 30, 2025, 12:50:05 PM | CSS tricks
Open Up With Brad Frost, Episode 2

Brad Frost is running this new little podcast called Open Up. Folks write in with questions about the “other” side

Apr 29, 2025, 4:10:05 PM | CSS tricks
Anchor Positioning Just Don’t Care About Source Order

The fact that anchor positioning eschews HTML source order is so CSS-y because it's another separation of concerns between content and presentation.


Apr 28, 2025, 2:30:06 PM | CSS tricks
The Lost CSS Tricks of Cohost.org

In this post, Blackle Mori shows you a few of the hacks found while trying to push the limits of Cohost’s HTML support. Use these if you dare, lest you too get labelled a CSS criminal.


<

Apr 24, 2025, 1:10:07 PM | CSS tricks
“Pretty” is in the eye of the beholder

Yay, let's jump for text-wrap: pretty landing in Safari Technology Preview! But beware that it's different from how it works in Chromium browsers.


Apr 18, 2025, 1:30:08 PM | CSS tricks
So, You Want to Give Up CSS Pre- and Post-Processors…

There was once upon a time when native CSS lacked many essential features, leaving developers to come up with all sorts of ways to make CSS easier to write over the years.


Apr 17, 2025, 2:20:07 PM | CSS tricks