Posts in the CSS Category

London Workshop Filling Up!

Published 20 years, 6 months past

I just talked with Ryan, organizer of the XHTML and CSS Workshop happening in London on Saturday, 4 June 2005, and he says there are only a few seats left—there were but seven when he contacted me on Friday, but for all I know it’s fewer now (and no doubt it is if you’re reading this post in the archives, instead of when it was first published).

Thanks to the very strong registration numbers, Ryan is seriously considering adding another day.  If that happens, it will mean the Saturday session is all sold out, so if you want to attend that day, you’d better get your reservation in quickly.  We’ll spend the day learning about the ins and outs of standards-based design, as well as chewing over attendee questions and generally having fun while we learn a ton.  And don’t forget about the exclusive Survival Kit CD-ROM that all attendees will receive.

All in all, a good time is in the offing, and it’s yours… but only if you grab a seat.

Update | 22 Apr 05: the Saturday session has sold out, and the Friday session has been scheduled.  Registration is open!


WWW2005: Microformats Track

Published 20 years, 7 months past

As recently announced by Mark Baker, Tantek Çelik and I will be co-chairing a full-day track on microformats as part of Developers’ Day at WWW2005.  We’ll announce the details in the near future, but we can already say that have some great speakers and topics lined up.  I encourage anyone who can to come check it out.  You can register at the WWW2005 site; make sure to check the option for “Developers’ Day, 5/14” when you do.

Tantek and I will also be presenting a poster on XMDP at the conference, and on Tuesday, May 10th, I’ll be delivering a half-day tutorial on Standards-Based Design—assuming enough people register, anyway—as well as delivering the afternoon keynote at, and participating in the closing panel for, the 2nd International Cross-Disciplinary Workshop on Web Accessibility (W4A).

Add to that an expected public appearance in Tokyo the evening of Friday the 13th (for which I hope to have details very soon) as well as a few other agenda items, and I’ve started to wonder if I’m going to have any time to sightsee while I’m there.  That’s becoming something of a theme, actually: I’m not expecting to have more than a day or so to make the rounds when I’m in London this June.

For some reason, I’m reminded of Mel Brooks in Blazing Saddles: “Work work work work work!”


Class Presentation

Published 20 years, 7 months past

A little while back, I made a joke about presentational class names.  As it happened, there was a second joke hidden within the joke—as is so often the case with me—and I was delighted to see that one of my readers caught it.

But is there a reasonable alternative?  I’ve long been using the class value border to indicate when I want to put a border around a picture.  This is, to me, one of those gray-area situations that’s very hard to resolve.  I can claim that border is not very presentational: it doesn’t say anything about the specific appearance of the border, only that there should be one.  I could also argue that it’s entirely too presentational: from a semantic point of view, what does it matter if the picture is bordered or not?  It doesn’t, so the class name is unacceptable.

And yet, it does matter.  Visually, some images need to have borders, while others need to lack a border.  I can’t invent a new element or attribute to express the difference (not without writing my own DTD, anyway).  Technologically, class values are the only place I can make the distinction.

There are some other sort-of-presentational class names hanging around my site, too.  standalone is used when an image, or set of images, stands on its own, as opposed to illustrative images that are floated.  The intent is presentational, though again, standalone doesn’t say exactly how the images stand alone.  It just says that they do.

I’ve yet to come up with a good semantic way of saying “this image needs to have something that visually separates it from the rest of the page”.  I’ve kicked around ideas for other values, like framed or separated, but these fall into the same gray area… probably because the intent is basically presentational.  I’ve abstracted the presentationalism of the intent, but it’s still there.

So, anyone have a better class name, or even a better approach to drawing the distinction?  And before anyone tells me to quit worrying about this, I’m not worrying—I’m playing.  It’s like doing a crossword, or working on a logic puzzle.  Usually I just do this stuff in my head, but in this case I’m fairly stumped, and could use some help.


Workshopping in London

Published 20 years, 7 months past

World Tour 2005 continues to add dates.  In addition to Japan (May) and Austraila (September), I’ll be heading to London for a one-day workshop on CSS, XHTML, and standards-oriented design to be held Saturday, June 4th.  You can get all the agenda and other details on “Professional CSS XHTML Techniques” from the Carson Workshops website.

This is a limited-access event: only 40 attendees will be allowed.  Suppose you’re one of that 40, as of course you should be if at all possible.  Not only does that give you a 1-in-40 chance of winning a full copy of Dreamweaver MX 2004, it also gets you the “Survival Kit”, a disc containing all kinds of examples, articles, tools, and so forth.  You’ll also get a whole day of high-tempo, practical instruction in CSS-driven design, with plenty of opportunity to pose questions and get answers.

While this won’t be a workshop for total beginners, it won’t require advanced knowledge of CSS and XHTML, either.  Basically, if you’re at least somewhat familiar with HTML or XHTML and know the basics of writing style sheets, then you’ll fit right in.  Even if you’re beyond that, I’ll be covering a  lot of ground that you should find interesting.

And then there’s always the opportunity to hang out that evening, after the workshop is officially over, and talk about whatever comes to mind.

“Professional CSS XHTML Techniques” — London, UK on Saturday, 4 June 2005.  Hope to see you there!


Keep Your Classes Clean

Published 20 years, 8 months past

A picture of three bottles of the general-purpose cleaner 'Simple Green'.  The first contains a dark green liquid, as you might except given its name.  The second contains yellow (lemon-scented) liquid, yet is still called 'Simple Green'.  The third is a white bottle with a purple label; again, it has the name 'Simple Green' prominently displayed.

See, that’s why presentational class names are such a bad idea.


Tabular Weirdness

Published 20 years, 9 months past

Recently I was doing some table styling for a client and ran into what I can only call tabular weirdness.  There were two different things that I stumbled across, and interestingly, they were the kinds of problems you wouldn’t be likely to encounter in layout tables.  These would come up much more often in data tables.

In the first case, the general idea was to put some space between the tables and the surrounding material, but as these were data tables, they came with captions.  So I of course put the caption text in caption elements.  That’s when things started to get inconsistent.

To be more precise, the problems began after I left Safari to check the page in other browsers. In Safari, you see, the caption’s element box is basically made a part of the table box.  It sits, effectively, between the top table border and the top margin.  That allows the caption’s width to inherently match the width of the table itself, and causes any top margin given to the table to sit above the caption.  Makes sense, right?  It certainly did to me.

However, according to section 17.4 of CSS2.1 and the figure that accompanies it, the caption sits entirely outside the table’s box, and that includes the table’s margin.  The two are still tied together by the generation of an anonymous box, but the upshot is that if you give the table left and right margins, then the caption does not follow suit.  If you give the table a top margin, it pushes the caption away from the table. This is the behavior evinced by Firefox 1.0, and as unintuitive as it might be, it’s what the specification demands.

The third piece of strangeness was found in IE/Win.  What I’d done was simply said that some cell borders should be solid—nothing more complicated than border-bottom: 1px solid.  The idea was that it would, as borders do, pick up the foreground color of the cell, but IE/Win had other ideas.  As best I could tell, the borders were a light gray.  You can see it happen in the testcase I constructed to create the images in this entry.  Explicitly specifying a border color fixes the problem, of course, but it was a bit of weirdness I thought I’d pass along in case anyone runs into the same thing.


Unjustified Caption Text

Published 20 years, 10 months past

I just stumbled across a browser bug this evening that I thought you all might like to know about.  So we all know that IE6/Win supports text-align: justify, right?  Wrong.  Sorry, but it’s the truth: IE6 does not fully support text-align: justify.  True, it mostly supports that declaration, but if you apply said declaration to a caption element, guess what?  You get centered, non-justified text instead.  It’s very much as though, in the case of caption elements, IE6 replaces justify with center.

I just thought I’d pass this along in case it might help anyone else avoid some furious head-scratching.  And, I’m sorry to say, I don’t know of a workaround.  If anyone finds one, please leave a comment to that effect.

This is a perfect illustration of how difficult it is to do comprehensive CSS testing.  Every CSS support chart I’ve ever seen has marked down IE6 as supporting justified text; I mean, why wouldn’t they?  It clearly did so… for the specific test cases used to create that support chart.  The odds of a test page including a caption element are pretty vanishingly small, unless of course we’re talking about a test page that includes every single XHTML element in existence.  And to test every element known for every property-value combination… well, I’ve talked about that before.  No need to trample the same ground even flatter.


Unbreaking the Web

Published 20 years, 11 months past

While I was in Florida with my family visiting both sets of parents, Tristan Nitot published an article titled “How Microsoft can support CSS2 without breaking the Web“.  In it, Tristan points to a comment made by Gary Schare, Director of Windows Product Management at Microsoft, which was:

We could change the CSS support and many other standards elements within the browser rendering platform. But in doing so, we would also potentially  break a lot of things.

(from Microsoft Windows Exec Talks IE, Firefox)

Tristan then goes on to refute this line of thinking.  Generally speaking, I’m entirely in agreement with him.  (As a disclaimer, Tristan and I worked together as members of the Netscape Standards Evangelism Team, and Tristan asked me for feedback on his article before it was published.)

Here’s the thing: in the Windows world, Explorer already significantly upgraded its standards support four different times.  The most recent such upgrade was called IE6.  That was the version that first added DOCTYPE switching to IE/Win.  At that time, there were a great many changes made to the standards support, nearly every one for the better.  For example, in standards mode, you could no longer throw around unitless numbers and have them interpreted as pixels, because that violated the CSS specification.  You couldn’t set a height or width for an inline non-replaced element, because that too was incorrect.  The interpretation of font-size keywords was changed to reflect the CSS specification instead of the HTML font-sizing regime.  The box model was altered to follow CSS instead of the old IE way.  In short, there was all kinds of stuff in there that would “break a lot of things”.

The Web rather steadfastly declined to be broken.  Oh, sure, there were pages whose layout was altered—not many, thanks to the way DOCTYPE switching was implemented, but they were out there.  Anyone who was relying on the IE/Win way of doing things but used a DOCTYPE that triggered standards mode (say, for example, a HTML 4.01 Transitional DOCTYPE with URI) ended up with a “broken” page.  These problems were fixed by their authors, and that was that.  I remember a number of forum posts about how “IE6 broke my design”, and the posts that helped those authors address the problem.  In the case of old, unmaintained pages, they stayed broken, but odds are that next to nobody cared.  Regardless, it isn’t exactly a point of major concern on any radars I’ve seen in the last three years.

Furthermore, IE6 fixed a number of parsing bugs that existed in previous versions.  One of those was the bug on which Tantek Çelik’s “Box Model Hack” depended.  However, the parsing bug was fixed in both quirks and standards modes, so the BMH utterly failed to work in IE6 no matter what DOCTYPE you used.  That actually did break quite a few layouts, if I remember correctly.  I also remember the day I discovered that they’d fixed the parsing bug in both standards and quirks modes.  I swore at my monitor for a moment, and then actually thought about it.  I realized that the inconvenience of removing a few CSS hacks, or at worst changing to different hacks, was a pittance to pay in comparison to the advances IE6 had made in terms of increased standards support.

So I fixed a few style sheets, tossed a hack out of my mental toolbox, and got on with my life.  I contend that exactly the same thing would happen if a service pack were to add increased standards support to IE.

This is particularly true given that most of what IE should add would be, well, additions.  As in, things that IE doesn’t even try to support now, and so almost nobody uses them.  Think generated content.  Think attribute selectors.  Think fixed positioning.  These are all things that, if they were added to IE, would break almost no pages at all.  In fact, they’d make a small number of pages work better in IE.

For that incredibly small number of pages that would break (for whatever value of “break” you care to name) with improved standards support in IE6, I’m willing to bet that nearly all of them would get fixed right away.  Why?  Because they would be pages maintained by authors who actually want to use standards and care about doing things right.

Now, there is one area where I think the IE team would have to be careful about adding support, and that’s selectors.  A lot of hide-from-IE CSS hacks these days are based on its failure to support the child selector; in fact, I use these a few places in the S5 style sheets.  It is possible that adding support for child selectors to IE6 would be more harmful than beneficial.  I say it’s possible because I don’t know.  Nobody does—but Microsoft of all organizations has the ability to find out, and to act accordingly.  They have the funding, the personnel, the skills, and the customer base.  As Tristan said:

In its short, 2 1/2 year life, the Netscape Evangelism team helped  literally thousands of authors and administrators of web sites around the  world to improve their support for the W3C DOM and CSS Standards. If such a  small group with limited resources can help change the web, imagine what  Microsoft could do with its resources if it only tried.

Indeed.

Granted, the net stands still for no one, not even Microsoft.  There have already been, and continue to be, efforts to graft better standards support onto IE despite itself:  projects like PNG transparency fixes, whatever:hover, and IE7 take Microsoft’s proprietary behaviors and use them to make it easier to use open standards.  (I adore the poetry of that.)  The people behind those projects are already doing what Microsoft is apparently afraid to do, and they demonstrate why improving standards does not mean breaking the Web.

There’s one other point to consider.  If IE/Win improved its standards support in any meaningful way, believe me when I say that the news would be shouted from the Web site of every standards advocate in the known universe.  Nobody responsible for standards-oriented pages could avoid hearing about it.  Any problems would be quickly explained, and adjustments made.  Life would not only go on, but be better for developers and designers.

To sum up: the “more standards will break stuff” argument just doesn’t fly any more.  Microsoft can figure out what to do that won’t break pages, and there’s a ton of things that are new-to-IE, the implementation of which will no more break pages than did the image toolbar.  In cases that might cause breakage, Microsoft can determine—with community help, if they were to ask for it—how to minimize breakage while maximizing benefit.  To claim that possible Web page breakage prevents Microsoft from increasing standards support makes about as much sense as to claim that possible program breakage prevents them from ever changing or improving their operating system.

Despite this, I don’t have  much hope that we’ll see any improvements before Longhorn debuts.  I think that’s a shame, because I remember when the IE team was gung-ho about standards.  There were a number of very smart people who understood why standards were important, and were committed to doing their best to support standards in IE—not just on the Macintosh, but for Windows as well.

I do hope for Microsoft’s sake that those days return.  Because the Web continues to move, and if they just stand there promising that everything will be better in Longhorn, they may well find themselves left behind.


Browse the Archive

Earlier Entries

Later Entries