Alfred’s CSS3 Notes – Multi-Column Text

September 2nd, 2010

Only supported in Webkit and Gecko, at the moment. Not available in Opera or IE.

section#mysection {
-webkit-column-count: 3;
-moz-column-count: 3;
column-count: 3;
-webkit-column-width: 15em;
-moz-column-width: 15em;
column-width: 15em;
-webkit-column-gap: 5em;
-mox-column-gap: 5em;
column-gap: 5em;
-webkit-column-rule: 2px solid #ff0000;
-mox-column-rule: 2px solid #ff0000;
column-rule: 2px solid #ff0000;
}

Cannot:

  • select a given column
  • size columns differently
  • specify percentages

column-rule property allows for border type effect between columns.

Alfred’s OS X Notes – Screenshots and Screen Captures

August 29th, 2010

Every once in a while I need to take a screenshot or screen capture in OS X. (So what’s the difference between a screenshot and a screen capture? None really, as far as I know. But you have to include both so people searching for either will find these nuggets of wisdom.) Invariably I have to look up how to do this: I don’t have a great head for keyboard shortcuts. :P So, I decided to keep a notes page on how to do it. Leave a comment if you use a different method or workflow.

This first set of commands I got from an Apple support page.

Command-Shift-3 (⌘⇧3)
Takes image of whole screen and saves it to desktop.
Command-Shift-4 (⌘⇧4)
Gives you a crosshair, which you can use to select an area of the screen. Also saves to desktop.
Control-Command-Shift-3 (⌃⌘⇧3)
Whole screen, saves to clipboard.
Control-Command-Shift-4 (⌃⌘⇧4)
Crosshair area selection, saves to clipboard.

My friend Joan (V-C, not S) recommended a program called Skitch, which not only captures screenshots, but also allows you to mark them up.

Alfred’s Apache Notes

August 26th, 2010

A few notes on configuring Apache.

Creating aliases within virtual host

ServerName example.com
ServerAlias examplea.com
ServerAlias exampleb.com
ServerAlias examplec.com

Running HTML files through PHP

AddType application/x-httpd-php .html

Alfred’s CSS3 Notes – Text Properties

August 26th, 2010

Text Shadow

text-shadow: 1px 1px 5px #BCBCBC, -1px -1px 3px #FF0000;

In this example, we have two shadows separated by commas. The first element is the horizontal offset, the second, the vertical offset; the third is the blur; and finally, the colour.

Text Stroke

Only available in Webkit. Draws a border around the text.

-webkit-text-stroke: 1px #000;

Also comes with text fill:

-webkit-text-fill-color: #fff;

This overrides the color attribute in Webkit.

RGBA Colour Opacity

Same as rgb() colour, but adds a fourth parameter for opacity. The opacity parameter is between 0 and 1, inclusive; where 0 is fully transparent, and 1 is fully opaque.

background-color: rgba(255,255,255, 0.5);

rgba() is available in all standards compliant browsers, and IE 9+. There is a workaround for dealing with the wrong-headed browsers:

color: #aaa;
color: rgba(200, 200, 200, 0.5);

As you can see we declare two values. In the case of standards compliant browsers, the rgba() declaration, which comes second, overwrites the first, and we get the benefit of the transparency. For the ludicrous browsers, the second declaration will be ignored, and they get the first declaration color.

We can also use a transparent png for backgrounds.

background: transparent url(bg.png);
background: rgba(255, 255, 255, 0.5);

This will not work with IE6, but anything after that will be OK. I encourage dropping support for IE6, to encourage individuals and corporations to upgrade, or better yet, switch to standards compliant browsers.

Alfred’s CSS3 Notes – Selectors

August 20th, 2010

Target Selector

Applies styling when the selector is in a target state. Which is to say it is the target of a hash mark in the URL.

#container:target {
  background-color: #f6f6f6;
}

Adjacent Sibling Selector

From CSS2:

h2 + p {}
Will select the second element when it immediately follows the first. (Reference)

General Sibling Selector

From CSS3:

h2 ~ p {}
Selects all p’s that share a parent with the h2. (Reference)

TextMate Notes

July 3rd, 2010

The time has come, the walrus said, to sit your fat ass down and learn TextMate. How can you code if you don’t know your tools? So, for now, just a few links I think I may want to keep around.

Multi-Stroke Key Bindings
Revert To Default Bundles
GetBundle

Finally Beat the Rogers Quick Start Menu

June 27th, 2010

In January, Rogers introduced a new feature to its cable TV subscribers: a Quick Start Menu. What’s on this menu? How can it help me? It doesn’t matter. The brain trust at Rogers decided to put the menu behind the “Guide” button, which normally brings up the Integrated Program Guide (IPG). If you actually want to see the IPG, you simply press the Guide button a second time. Convenient, no?

Immediately, a Facebook group was put up to entreat (read “browbeat”) Rogers into removing this intrusion into their customers’ workflow.

Rogers’ response? They gave us a way to switch the menu and guide around. So when you press the Guide button, you actually get the guide. But if you press it again, you get the menu. Marginally less annoying. Good job, whoever’s doing UX at Rogers.

You know, there are buttons on that remote which never get pressed. The B and C buttons for instance. Wouldn’t it be a good idea to put the menu behind those? More »

The State of the Interwebs

March 3rd, 2010

JESS3 / The State of The Internet from JESS3 on Vimeo.

Podcasts We Love

February 23rd, 2010

I’ve been giving my mom my castoff MP3 players. Recently I bought my parents His & Her’s iPod Nano’s. New ones even. And that’s when Mom discovered the joy of podcasts. She’s got her own faves, but they’re mostly (all) French, which doesn’t really jive with my readership (yep, the same three dudes). So I thought I’d tell you about some of the podcasts I listen to on a regular basis.

(BTW, if you’re not clear on the whole “podcast” thing, don’t sweat it. Check out these resources:

Tucows: How to Listen to Podcasts
Tucows: Tell Me About… Podcasting
butterscotch: Tune In: A Novice Guide to iTunes)

But first a quick rant about why podcasts are important, and should be part of your life. You’ve got limited time to expose yourself to content. You can choose pre-packaged, pre-digested, top-40’s content, or you can consume interesting, thought provoking material. You are what you ingest.

We’ve spent the greater part of our lives consuming content curated for us by others. The promise of the Internet was that we could assemble our own content feed. Is this good or bad? If you seek out content which agrees with your opinions, you’ll have no challenging opinions. No counterpoints. That’s probably not a good thing. So, I recommend finding content from a wide spectrum of sources. You may disagree with some of the views, but at least you’ll have exposed yourself to challenging opinions, and will be better able to articulate objections to those views. (OK, rant off.) More »

Crash and Renewal

February 22nd, 2010

DSC_0016
I was on my way to work, on a fine Tuesday morning. Heading South on Dufferin, at Davenport, I had the green. A white Volvo was headed North, but suddenly, without signaling or giving me my right of way, turned West, crossing into my lane. I swerved trying to avoid it, but no go. It plowed into my front left. Both air bags deployed. More »