Archive: January 9, 2015

<<< January 8, 2015

Home

January 10, 2015 >>>


iconic

Friday,  01/09/15  09:34 PM

Eight years ago today, Steve Jobs announced the iPhone, quite possibly his best "jobsnote" and almost surely the one for which he will be best remembered.  (If you're interested, I've kept a little gallery of Jobsnotes of note).  At that time he was already a legend, having founded Apple and developed the Macintosh, left in disgrace to found Next, returned triumphantly to launch the iMac, and then having restructured the music industry with iTunes and the iPod.  We knew he was going to announce a phone and we knew it would be cool.  But we didn't know he was going to restructure the telecom and computer industries and propel Apple to becoming the most valuable company in the world.  Re-watch and enjoy!

Apropos: Selling Apple Watch.  "I’ve learned to change the way I explain Apple Watch to friends and family. Instead of starting out with a list of reasons why they may enjoy an Apple Watch, I now begin with a pretty simply explanation: Apple is making a watch with customizable faces and bands."  Hehe.  And Apple made a phone with customizable icons... 

I wonder ... do you suppose that in years hence we'll recall Tim Cook's "iWatch" announcement with similar reverence?  I doubt it.  The Apple Watch might become a huge success and might even restructure the watch industry, and it might herald a new age of wearable computers, but the announcement itself was somewhat lacking in flair and drama.  I don't [yet] have a "Tim Cook keynotes of note" web page.  One obvious difference, Steve Jobs knew he was about to change the world (even if we did not), while Tim Cook was [perhaps fittingly] much humbler.

MG Siegler: Whittling down the MacBook to an iPad.  At least in terms of hardware, there is a convergence.  I might be old school but to me there's a huge difference between the platforms for content creation.  I would not want to code, or create web pages, or edit movies or photos, or even to blog regularly on an iPad*.  For content consumption the victory of tablets is already complete. 

* The key restriction for blogging is multi-windowing.  While blogging I have literally dozens of windows open; not only my blogging tools and blog sources, but various types of editors.

Dumbest story of the day: France has strict gun laws, why didn't that save Charlie Hebdo?  This isn't a parody, but perhaps it should be...  What would have happened if even one of the victims had been armed? 

Excellent: Every mission to Mars, visualized.  I didn't realize the USSR had so many failures, and the total number of missions took me by surprise.  How many more before we have a manned mission to Mars?

 

 

of nested CSS selectors

Friday,  01/09/15  11:04 PM

<rant nerdlevel="11">

Today I actually used this selector in a style sheet:

table:not([bordercolor="#C0C0C0"]) > tbody > tr[bgcolor="#ffff99"]
  { display: block; border-radius: 15px; box-shadow: 2px 2px 4px #a0a0a0 }

Figuring out I needed to do this took me deep into the arcana of CSS selectors.  As you know, with CSS you specify the object(s) you want to style, and then what you want to do with them.  The specification of objects(s) is accomplished via selectors.  I had used the three most simple selectors before: specification by tag type (<tag>), specification by class (.<class>), and specification by id (#<id>).  For this case I wanted to style specific <tr>s unless they were inside a specific <table>s.

The <tr>s to be styled could be identified via their background color, hence, tr[bgcolor="#ffff99"].  The <table>s to be excluded could be identified via their border color, hence table[bordercolor="#C0C0C0"], specified with the :not property.  So at first* I tried this:

table:not([bordercolor="#C0C0C0"]) tr[bgcolor="#ffff99"]
  { display: block; border-radius: 15px; box-shadow: 2px 2px 4px #a0a0a0 }

But no joy in Mudville, it didn't work.  Huh?

The tr[bgcolor="#ffff99"] selector selects the <tr>s I want (I experimented to verify), and the table:not([bordercolor="#C0C0C0"]) selector selects all tables except the ones I want to exclude (I experimented to verify).  But no workey.  The <tr>s inside the <table> s were *still* selected and styled.

After a lot of extended messing around, I figured it out.  Turns out the <tr>s in question were inside the <table>s in question, but those tables were themselves nested inside a table which was not excluded.  Separating two selectors by a space only requires nesting, not immediate nesting.  Aha!

So next I tried this: 

table:not([bordercolor="#C0C0C0"]) > tr[bgcolor="#ffff99"]
  { display: block; border-radius: 15px; box-shadow: 2px 2px 4px #a0a0a0 }

The ">" means immediate nesting, the first selector must be the direct parent of the second.  But that didn't work either.  One more insight later, I realized that all <table>s actually have a <tbody>, even if it isn't explicitly specified, and so the <tr>s are actually nested inside a <tbody>, which in turn is inside the <table>.  Hence the selector shown at top, which worked (yay!).

You can see the result here.  I'm quite proud of myself :)

</rant>

* The "at first" part of this is a lie; understanding attribute selectors and :not required a lot of Googling.

 
 

Return to the archive.