Posts in the CSS Category

Fabian Valkenburg sent in e-mail letting me know that my comments on Opera 7’s CSS support got used in the talkback to an evolt.org article, and that I’m wrong about Opera 7’s display of the dates on this page being a bug.  As it turns out, the answer to that is “maybe.”

First, a word on how I set up the title and date styling in the basic site theme.  Both are contained in successive h5 elements, each with an appropriate class value (title and date, in fact).  I make the title inline so I can wrap a border around it that “shrink-wraps” the text.  Then, since I want to move it upward, I relatively position it upward two-third of an em.  Since it has been relatively positioned, for the purposes of laying out other elements, browsers should act as though the element wasn’t positioned at all.  (See CSS2:9.4.3 for details.)  So, in that sense, the relative positioning should have no impact on how the date is laid out, and in fact it doesn’t in the browsers I tested; I only brought it up to show that the title wasn’t floated.  On the other hand, I float the date to the right and right-align its text.  Since I’m floating the date to the right from below the place where the date’s h5 would have been (because the date comes after the title), I give it a negative top margin to pull it upward, so that it sits just below the top border on the entry.

Now here’s where things get fuzzy.  According to CSS2:9.5.1, the outer top edge of a float may not be any higher than the top of preceding float or block boxes.  It doesn’t say anything about inline boxes.  Remember that with CSS, it’s possible to have inline and block boxes for sibling elements.  So the effect of that portion of CSS2 is to allow floats to ignore preceding inline boxes when they float.  Or not ignore them, as the case may be.

Let me frame it another way: here’s a testcase that shows h3 and h4 elements in the normal flow, and then with the h4 elements floated.  To my way of thinking, both floats should sit below the h3 elements that precede them, regardless of the type of box those h3 elements generate.  This is because my conception of floats is that they start from their place in the normal flow, and then move to the right (or left).  From there, they move downward if they must, but not up.  Unless I give them a negative top margin to move them up, of course.

The behavior I just described is what IE5.5/Win and Gecko-based browsers do, to pick two examples.  But what Opera 7 (and, in many cases, IE5/Mac) does is not a bug, because it doesn’t violate the CSS specification, so I retract my earlier statement.  I believe that what it does is not what  site authors would want, but it isn’t wrong.  Thanks to the wording in CSS2:9.5.1, neither are the browsers that don’t agree with Opera 7 wrong, although I would accept that they’re further away from the letter of the specification.  Whether or not they violate its spirit isn’t clear, and it’s in cases like this that browsers tend to do whatever their programmers thought best.

So what we have here is a gray area in which I believe the letter and spirit of CSS are pulling in different directions, and browsers are splitting over which path they choose.  Hopefully CSS2.1 will be clarified to address what should happen, and we won’t have to bother arguing about who’s doing what better in which way for whom.

As for css/edge, yes, I hear you.  Opera 7 gets most or all of the demos correct, and may in fact reveal some erroneous assumptions on my part in the pure CSS menus demo (or maybe not; I don’t know yet).  When I get time to actually run Opera 7 through all the demos and evaluate its behavior, I’ll see if I can get the support information updated.  Unless of course I finally decide that the support information is becoming too much trouble to have around, in which case I’ll update it into oblivion.  It never really helped prevent people from misrepresenting what the demos were supposed to do anyway.

Personally, I like Opera 7 (or did once I switched its skin to the classic look), and my comments weren’t meant to cast it into the junkbin of bad browsers.  If I were a Windows user, I’d probably use it a lot more than I do.  There are rough edges, as with any browser, but overall it’s quite good—I think I said that already, but some people don’t seem to have heard that part.  Opera 7 handles a site redesign project I’m working on a lot better than Opera 6 does, I’ll say that much.

• The Silence of the Fat Lady was published on Saturday, February 8th, 2003.
• It was assigned to the Browsers, CSS, and Standards categories.
• There have been no replies.

Just a quick reminder that the WThRemix competition closes in eleven days.  Here’s your chance to remake the face of the W3C Web site, and maybe win some peer accolades and a few prizes along the way.  I’ll be impressed by any entry that gives the W3C site a bold new look without changing its markup structure at all, personally, but I’m not a judge so impressing me won’t get you anywhere in the competition.

Did I mention that the different thematic choices for adactio.com are really, really impressive when you visit the author’s journal?

I somehow missed the announcement of the winners of AllTheWeb‘s restyling competition, so I’m going to mention now that the contest is over and the winners’ entries publicly available.  There are some really good entries.  I worked (remotely) with one of the runners-up when he was an intern at Netscape last year.  Speaking of which, I hope to have some good (or at least interesting) news in the near future.

I’m off to be a geek or a guru, or maybe even both, at Tri-C’s Western campus tonight, where I’ll talk about (among other things) how CSS can be used to restyle any site, regardless of what the site author has to say about it.  Hope to see you there!

• Restyling Madness! was published on Thursday, February 6th, 2003.
• It was assigned to the CSS and Speaking categories.
• There have been no replies.

I’ve watched word of the Web Standards Meetup work its way through various blogs like a slow conceptual pulse, so I may as well keep it going.  I seem to be the only one in my area signed up so far, and I’m slightly bummed that there are cool people like Nick and Molly signed up in cities far away from me.  Of course it was only after I signed up that I realized the meetup is the same night I’m presenting at a local community college, so I’d be incredibly late or in absentia anyway.  Of course, people interested in standards could come meet at the talk, and then we could all go to a nearby place afterwards.  It’s an idea.  It might even be a good one.  You be the judge.

I’d been toying with the idea of trying to get local Web folks to assemble for socialization and (human-relation) networking for a while now, but thanks to Meetup I don’t have to undertake the organizational effort.  That’s pretty cool.  It just makes sense someone named Eric would be involved in something that cool.  We’re everywhere, and everywhere we go is cool.  That’s the kind of cool we are.

Some time yesterday, someone asked how my new book was coming along.  I asked which one they meant.  It turned out they meant Eric Meyer on CSS, and that they’d spotted a mention of it on MozillaZine.  So I went over to see what they had to say, and discovered they were saying that evolt had posted an interview with me last Saturday.  Well, shoot the horse and slap me silly!  I’m always the last to know.

Actually, said interview was already available in Italian, and I forgot to mention that fact until now.  I sense a karmic balancing here.

So, Opera 7.  It’s out, and yes, it does wonderfully well on css/edge, so you can all stop e-mailing me now.  I’ll update the demo pages one of these days to say so, I promise.  Just not today.  Opera 7 still suffers from some disappointing CSS bugs, though.  One is on this page right here, assuming you’re using the default page stylesheet or one of its variants.  The entry dates should be appearing below the horizontal line at the top of each entry, not above the borders.  Also, on my Speaking page, the :first-line underlining of li children of ul#upcoming is being applied to more content than it should.  Neither is really tragic, but they are a touch annoying.  Opera 7 also has some problems with negative text-indent values on block-level links; it seems to be flipping the sign on the value, so that it’s positive.  But I could be wrong about that, since I haven’t invested a lot of time in detailed analysis of the behavior.

There have also been some changes that make OperaShow do odd things to some of the files available on my Speaking page.  It’s probably a case of my writing my projection-media CSS to cater to Opera 6 bugs, and Opera 7 having fixed said bugs.  I probably won’t get around to fixing up old talk files, so if you really want to see them as first written, keep a copy of Opera 6 around.  Hey, at least you can have multiple versions of Opera on your computer, just like most browsers.

These are just the things I’ve noticed from a little surfing around.  To a degree, I’m just picking nits, but I also wonder how many other “combinatorial” problems I’m going to encounter.  It’s one thing to pass a test suite, which is a set of controlled circumstances that is easily predictable.  Dealing with the wonderfully wacky ways authors like to combine bits of CSS in pursuit of a given effect is something else entirely.

Is Opera 7 better than Opera 6?  Yes.  Does it have a good CSS engine?  Yes.  Is it the best CSS engine I’ve seen?  No.  Close, but not quite.

On a completely different front, the interface on this medical detector is really cool, not to mention the technology itself is pretty nifty.  Give ’em about 15 years to wedge in more advanced scanners and extra features, and we’ll have tricorders after all.

• Increasing Circulation was published on Wednesday, January 29th, 2003.
• It was assigned to the CSS and Personal categories.
• There have been no replies.

Lists seem to be my topic-of-the-moment, but this is about a different kind of list.  It’s hard to believe this, but it was a year ago today that the mailing list css-discuss was launched.  By my slightly rough count, the list carried 17,455 messages to its subscribers in calendar year 2002, and has nearly reached 19,000 messages total.  Just over one thousand of those messages were sent in the first eight days alone, which sent a lot of early subscribers running away in horror, and caused me to wonder if I was going to be crushed by the flood.  Due to overloading problems, we had to switch servers twice before finally migrating to the current home, graciously provided to us by evolt UK.  The list averages about fifty messages per day, both at present and as a lifetime average,.  Even though we moved the list to a new server and required people to actively re-join the list at that time, it has nearly 1,500 subscribed accounts.

I’ve worked hard to keep it a practical list with a high degree of signal, and I’d like to think those efforts have paid off.  We have the occasional hiccup, and every now and again a thread gets out of hand, but overall I think the list has been a lot more worthy than not.

I’d like to extend my deepest thanks to John Allsopp of Western Civilisation, which provided the list its first home; to John Handelaar of Userfrenzy and evolt UK, who manages the server where the list now resides; and to all the members of the css-discuss community, who make it useful through their contributions, discussions, and continued respect for one another and the list itself.  No community can be truly great without active support from its members, and the members of that list are very active in making it the kind of place I’d hoped it would be.  My thanks to you, one and all.

• A List, A Year, A Look Back was published on Friday, January 24th, 2003.
• It was assigned to the CSS category.
• There have been no replies.

Douglas Bowman ruminates over the use of list elements (i.e., <ul> and <ol>) as the basis for navigation links, tabbed interfaces, weblogs, and just stuff in general.  Is it okay to use an unordered list to hold the lists that drive your site?  Should a weblog just be an enormous ordered list?  If you do those things, does the semantic meaning of the list change to the point that it’s no longer really a list?

Well, kell co-ink-e-dink!  Tonight’s talk at COMMUG deals almost entirely with ways to take lists and restyle them to get panels, tabs, flowchart-like structures… pretty much everything Doug was talking about.  I’d even been planning to talk a bit about the semantic joyride such approaches can mean, at least to some people.

So here’s the short version of what I think: looked at a certain way, pretty much everything can be represented as a list.  The U.S. Census, the Solar system, my family tree, a restaurant menu, the stuff I did yesterday, all the friends I’ve ever had and lost—these can all be represented as a list, or a list of lists.  So the question isn’t really whether we should be putting all this stuff into lists.  The question (at least at this stage of the game) is whether or not the markup structure meets the job, and helps with accessibility concerns.

Now, should we have markup structures that meet the jobs more closely?  Maybe.  XHTML 2.0 has the <nl> (nestednavigation list) structure, which comes closer to making the markup name match the structure’s intended role.  I’m not convinced this is necessary; it’s already possible to just take nested lists and turn them into menu systems using CSS, assuming a sufficiently capable user agent.  It’s still a topic worth consideration and exploration.

• Listing Toward the Future was published on Thursday, January 23rd, 2003.
• It was assigned to the CSS category.
• There have been no replies.

So last night Kat and I headed down to the Cinematheque to meet up with Ferrett, Gini, and Jeff to see Jesus Christ Vampire Hunter.  Wow!  It was… well, it was… I mean to say, it… it’s not really describable.  But it was quite funny.  I might pick it up on DVD if it ever comes available.  As Ferrett said on the way out, “Oh, I can’t wait for the commentary track for that one.”

Meantime, the recent ruling on Eldred v. Ashcroft sparked a lot of debate on a computer book authors list to which I belong.  I stayed out of it for a while, because I didn’t have much to say, and then suddenly—as is often my wont—I realized I had something to say after all.  So I said it, and I figured, what the heck, I could say it here too.  So if you want to know what I think about copyright terms, feel free to read away.  If not, no sweat.  It’s automatically copyrighted either way, as it happens, and now nobody else can say the same thing for more than a century, or something like that.  How much sense does that make?

I still don’t know why I think so, but this is darned cool.  I’m probably just jealous I didn’t think of it first.

• Oh, There’ll Be Plenty was published on Sunday, January 19th, 2003.
• It was assigned to the CSS, Personal, and Politics categories.
• There have been no replies.

Simon Jessey has confessed he wrote the Amazon review I mentioned on Thursday, and furthermore says he pictures me mostly as Li Mu Bai with a little Jen Yu thrown in.  Hmmmm… that’s definitely an interesting image.  Anyway, I’ve created a new presentation option for the site to celebrate being called “The Li Mu Bai of Cascading Style Sheets”: please enjoy wo hu cang long.  Note that this new theme has a layout bug in IE5/Mac which appears to be related to the alternate-style switch, and not the CSS itself.  There isn’t much I can do about it, as the bug doesn’t happen in static test documents.

On the other hand, Robert Kirkpatrick wrote in to advise me that I should work to be the Cheng Pei-pei (who played the Jade Fox in Crouching Tiger, Hidden Dragon) of CSS.  Of course, we’re mixing actual people and characters here—in the movie, of course, Li Mu Bai is the more skilled, but in real life it’s likely Cheng is more skilled than Chow.  Either way, I’m flattered.

I’m also feeling under the weather, which is ironic given how nice a day it is today.  Off to the couch for tea with lemon and maybe a movie.  The Killer is always a good choice.

• Green Destiny was published on Sunday, January 12th, 2003.
• It was assigned to the Books, CSS, and Writing categories.
• There have been no replies.

At least one good thing has come out of the apparently-ending-soon thread on www-style: Robin Berjon posted a link to the specification for Ook!, which I hadn’t encountered before.  It was so beautiful, I shed a tear of joy.  Great domain name, too.

As I read How to Write Like a Wanker (thanks to Simon for the pointer), for some strange and obscure reason I found my thoughts once more turning to the aforementioned www-style thread.  I really have to find something else to occupy my mind.  I hear girls are a very popular mental obsession for some people; maybe I’ll try that.  I’m sure my wife will be just thrilled.

Carol Spears wrote in to share some CSS magnetic poetry with me, so I’m sharing it with you.  There are some other interesting CSS examples on the same page, so check them out.  They remind me a little of my one bout of noodling.  (Suddenly I wonder if I should shift that into css/edge.)

Here’s something interesting: Now Corporations Claim The “Right to Lie”.  I found the link at the O’Reilly Network, so you’ve probably already seen it, but if not I highly recommend a reading.  The historical information alone was quite fascinating.  For another side to the story, there’s a wire piece from last November over at CNN Money that concerns me as well.  I don’t believe corporations should ever have a right to lie, and it appalls me that we’ve come to that even being a question.  But is there a right to restrict what news organizations (even those owned by huge media conglomerates) can say, or what corporate members can say to the press, about politics or corporate behavior?  Does the actual ruling mean that?  I don’t know, but the whole thing bothers me.

• Elegance and Eloquence was published on Monday, January 6th, 2003.
• It was assigned to the CSS, Humor, and Politics categories.
• There have been no replies.