Latest News

Oh hey, so tomorrow (tomorrow!) is Election Day here in the United States. We’re not in the business of making political endorsements or anything like that at CSS-Tricks, though we do endorse that everyone exercise their right to vote.

I did exactly that two years ago and posted a CSS rendition of the “I Voted” sticker that came with my California mail-in ballot.

Fast forward to today, and I received a new sticker in the ballot sporting a fresh design.

I have a little time, so I’m going to try to re-create this sticker in CSS and walk through my thought process as I do it. Feel free to follow along if you’d like!

The post Rocking California’s “I Voted” Sticker in CSS for Election Day 2018 appeared first on CSS-Tricks.

Rachel hooks us up with what the CSS Working Group is talking about:

• Styling scrollbars. This would come with properties like scrollbar-width and scrollbar-color. The best we have right now is proprietary WebKit stuff.
• Aspect ratios. I imagine the CSS portion of this journey will be best handled if it plays nicely with the HTML intrinsicsize stuff.
• Matching without specificity. :where() is :matches() with no specificity, and :matches() may become :is().
• Logical Properties shorthand. The team is

…

The post What’s New In CSS? appeared first on CSS-Tricks.

I think of named grid areas in CSS Grids as bring-your-own syntactic sugar. You don’t absolutely need them (you could express grid placement in other ways), but it can make that placement more intuitive. And, hey, if I’m wrong about that, correct me in the comments.

Say you set up a 3-column grid:

.grid {
display: grid;
grid-gap: 1rem;
grid-template-columns:
200px 1fr 1fr;
}

No rows defined there; those are implicit and will appear as needed. We could define them, …

The post Simple Named Grid Areas appeared first on CSS-Tricks.