Nick Walker

0February 6, 13

Kirkland has adopted Marker Felt for all manner of packaging, including soups and, apparently, Turkey Breast.
That doesn’t make any sense. — Camera: iPhone 4

Aperture: f/2.8

Exposure: 1/120th

Focal Length: 3mm

Kirkland has adopted Marker Felt for all manner of packaging, including soups and, apparently, Turkey Breast.

That doesn’t make any sense.

0January 17, 13

Webkit Pseudo Element Animation Lands →

Amongst the many annoying limitations of pseudo elements, none were quite as confusing as the fact that they didn’t take transition or animation properties. No more (once, of course, this makes its way into public releases).

0January 9, 13

Magnet School Fair flier for Northside Independent School District.

0January 6, 13

I don’t understand the 15-17 bracket’s affinity for compulsive abbreviation. Especially when spelling out “for” would actually help balance a layout.

0December 14, 12

Mishka type-specimen for the Photography Club’s Holiday Photo Booth.

0November 11, 12

Objectification shirt for the Photography Club.

0November 7, 12

Objectification shirt for the Communications Arts Class of 2014.

0August 6, 12

CSS Filter Drop-shadows

Ever tried to style an image that has irregular bounds (like a trapezoid) with a box shadow? You’ve run into the biggest limitation of the venerable box-shadow; the shadow is always cast by the square bounds of the element. This limitation can be frustrating if you mock up complex shadows and end up having to bake them in.

No more! (Well, soon no more. Filters only work in webkit right now). Just add a CSS filter drop-shadow and you’re set with animatable, resolution independent, transparency aware drop shadows. Here’s a spinner with a drop-shadow. Exciting!

I’m using this on my home page on a handful of svg elements. Can’t wait to see what the wider web does with this tool.

0July 30, 12

Webkit Transforms and SVG

Another day, another Webkit bug. Apply a scale transform to an element that has an SVG graphic as a background and you’ll see bitmap scaling artifacts. Firefox does what you would expect is supposed to happen and continually rasterizes the SVG at new scales. Here’s a demo fiddle.

There’s no work around that I know of.

8July 29, 12
Reblogged from bricss

Better Print CSS on the Horizon →

bricss:

One of the lesser known CSS properties I’m really excited about is box-decoration-break. From the official spec:

When a box is broken at a page break, column break, or, for inline elements, at a line break, the ‘box-decoration-break’ property specifies whether box fragments are treated as broken fragments of one continuous box, or whether each fragment is individually wrapped with the border and padding.

Exciting. Page-break-inside works in Safari 6;I’m using it here. One look at the print preview is enough to get you excited about all of the possibilities better print control will bring.