Mastodawn

Frontend Dogma Jul 4

“:nth-last-child”, by @kevinpowell:

https://html-css-tip-of-the-week.netlify.app/tip/nth-last-child/

#css #selectors

:nth-last-child

Select elements by counting backwards from the end using the :nth-last-child pseudo-class selector.

Frontend Dogma Jul 4

Quantity Query Carousel, by @chriscoyier (@frontendmasters.com):

https://frontendmasters.com/blog/quantity-query-carousel/

#css #selectors #grids #layout

Quantity Query Carousel – Frontend Masters Blog

:has() makes quantities queries both easier and more powerful. We can alter how a grid is laid out and where the children go. Or, we can just blast it into a carousel.

Frontend Dogma May 17

What Is [the] CSS Owl Selector (“* + *”)?, by @zoranjambor (@cssweekly):

https://www.youtube.com/watch?v=0O0ssm70g1g

#videos #css #selectors

What is CSS Owl Selector (* + *)?

YouTube

Frontend Dogma May 15

“:out-of-range”, by @kevinpowell:

https://html-css-tip-of-the-week.netlify.app/tip/out-of-range/

#css #selectors

:out-of-range

A quick look at the :not-in-range psuedo-class.

Frontend Dogma May 11

HTML Oddities: Does the Order of Attribute Values Matter?, by @Edent:

https://shkspr.mobi/blog/2025/04/html-oddities-does-the-order-of-attribute-values-matter/

#html #attributes #css #selectors

HTML Oddities: Does the order of attribute values matter?

HTML elements can have attributes. For example id, class, src, alt, and many others. These attributes can contain values - an img element's src attribute has a value which is a link to an image. An id attribute's value is a single string. But some attributes can contain multiple values. Here's a thought experiment for you. Consider these two HTML elements: HTML<p class="alpha bravo…

Terence Eden’s Blog

Frontend Dogma May 9

“:placeholder-shown”, by @kevinpowell:

https://html-css-tip-of-the-week.netlify.app/tip/placeholder-shown/

#css #selectors

:placeholder-shown

A quick look at the :placeholder-shown pseudo-class for styling form elements that are displaying placeholder text.

Frontend Dogma Apr 24

Getting Specific About CSS Specificity, by @kathryngrayson:

https://dev.to/kathryngrayson/getting-specific-about-css-specificity-256m

#css #selectors #cascade

Getting Specific About CSS Specificity

Everything you never wanted to know about why some styles override others in your CSS.

DEV Community

Frontend Dogma Apr 18

“:only-child”, by @kevinpowell:

https://html-css-tip-of-the-week.netlify.app/tip/only-child/

#css #selectors

:only-child

Learn how to use the :only-child selector to style elements differently when they have no siblings. Perfect for adaptive designs with optional elements like figure captions. Plus, see how combining it with :has() creates powerful parent styling possibilities.

Frontend Dogma Apr 14

Making “:visited” More Private, by @developers:

https://developer.chrome.com/blog/visited-links

#css #selectors #privacy #chrome #google #browsers