Styling elements based on the “more than one” and “fewer than two” thresholds is a neat trick, but a flexible “quantity query” interface would accept any quantity. That is, I should be able to style “more than or equal to n” for any value of n. Then I can style “more than or equal to …
Tag Archives: css3
3D First Person Shooter … with CSS
With CSS transforms we can’t define arbitrary shapes using a set of points, we’re stuck with HTML elements which are always rectangular and have two dimensional properties such as top, left, width and height to determine their position and size. In many ways this makes dealing with 3D easier, as there’s no complex math to …
(ab)using CSS3’s :nth-child() selector to invent new ones
When combining :nth-child() with some other pseudo selectors, one can actually create new types of selectors. “:nth-of-m-child” selector /** * This selector will select the third element in a row, * if it is also the third to last element … thus selecting * the 3rd child in a row of 5 elements */ span:nth-child(3):nth-last-child(3) …
Continue reading “(ab)using CSS3’s :nth-child() selector to invent new ones”
CSS3 text-align-last
.caption { text-align: justify; text-align-last: center; } The text-align-last property describes how the last line of a block or a line right before a forced line break is aligned when ‘text-align’ is ‘justify’, which means you gain full control over the alignment of the last line of a block. As seen in the example above …
Internet Explorer Platform Status
MixItUp – A CSS3 and JQuery Filter & Sort Plugin
CSS3 Marquee
Yesterday, I sent out this tweet: <font color="#FFFF00"><marquee behavior="alternate" bgcolor="black" scrollamount="10">Sometimes I miss the olden days</marquee></font> — Bramus! (@bramus) February 12, 2013 Rather soon I got a reply by @vormplus: @bramus we should recreate blink and marquee with css3. Add some extra magic to the web 😉 Sparked by this reply I got started … …
tiltShift.js
Adobe Edge Webfonts
Edge Web Fonts is a free service that provides access to a large library of fonts for your web site. It’s one of the Edge Tools & Services from Adobe. Use of the fonts is free and unlimited, see the terms for details. Also integrated in their new set of Edge products Too bad they …
Fontello – iconic fonts scissors
This tool lets you combine iconic webfonts for your own project. With fontello you can: shrink glyph collections, minimizing font size merge symbols from several fonts into a single file access large sets of professional-grade open source icons First, select the icons you like. Then update glyph codes (optional), and download your webfont bundle. Source …