A tribute to selectors

Picture this conversation between these two geeks. I’m using CSS attribute selectors to usr the cite attribute of the <blockquote> element to add the geeks’ portraits.

<blockquote cite="https://www.andybudd.com/…"></blockquote>

blockquote[cite^="https://www.andybudd.com"] { 
padding-right : 130px; background : url(budd.jpg) no-repeat right top; }

<blockquote cite="https://www.hicksdesign.co.uk/…"></blockquote>

blockquote[cite^="https://www.hicksdesign.co.uk"] { 
padding-left : 120px; background : url(hicks.jpg) no-repeat left top; }

---

“I’ve always thought it would be handy to have a little portable music player for those moments when you want to kill a bit of time, say on the odd trip up to London or down at the gym. The iPod shuffle is great for this as it’s random nature fits perfectly with my usage patterns.”

“I guess I’m looking for a powerbook equivalent to the Home on an iPod idea, where my powerbook has all the files. Simply connecting the powerbook to my monitor isn’t that simple, as I would have to get a ADC to DVI convertor and use up the only firewire port on the powerbook.”

“At the end of October I put in my order for a 17inch 1.8GHz G5 iMac with Airport, Bluetooth and a 160GB hard drive. Checking out the status page it looks like delivery is set for sometime this week and I have to say I’m quite excited.”

---

If you delve into the source code of this page you’ll see that the cite attribute of each quote is different and points to an individual URL on each gentleman’s site.