Makzan / I share what I learnt

CSS Quantity Selector

The Quantity Queries for CSS essay from A List Apart shows how we can use current CSS selectors to perform quantity queries. By using the techniques in the essay, we can apply styles when the element count matches specific number, or when the element count is greater or smaller than the specific number.

Demonstrating nav showing 2 items, 3 items and 4 items with different font size

I created a demonstration on how this technique can be used in navigation. The font size is smaller when there are more items in the list. Imagine when the navigation items are controlled from a CMS and we have no control on exactly how many items there will be. This technique allows us to control the styles of an unknown amount of items.

Published on March 12, 2015. More articles like this: CSS, Web Technologies.

Sign up for weekly dispatch each week.

Want productive tips and web technologies links like this in your inbox each week? No spam ever. Just useful content:

Read previous weekly dispatch newsletters.