The Fugue

Counterpoint by Hans Fugal

display: inline-block

Posted by Hans Fugal Wed, 07 Nov 2007 15:10:00 GMT

I'm not an HTML/CSS guru, but I do know my way around and I do try to use "semantic HTML" and CSS for styling wherever possible. I hate tables for layout, if for no other reason than they're a big mess and hard to read, and I do all my HTML by hand (or generated programmatically, e.g. by Markdown, Markaby, or Haml).

So I'm a little bit surprised that even lil' ol' dabbler me has more than once wished to put blocks together in an inline-like flow, e.g. for a photo gallery or other dynamic grid-based layout, and yet the big guys are content to fall back on tables. Maybe I can afford to be more puritanical as a hobbyist.

I dug into the issue once again, determined to finally grok the CSS box model and view model once and for all. I don't know if I got that far, but I do understand enough about display: block and display: inline to see why it doesn't work the way I was hoping it would work. It boils down to a block element will seek the left edge of its parent.

But, there *is* a way to do precisely what I want to do in CSS 2.1. It's called display: inline-block, and it says to layout block elements in the inline flow. If you're still lost about what I'm driving at, there's a nice live demo and screenshot of display: inline-block at quirksmode.org. Alas, IE and Gecko (Firefox, Mozilla, Camino, etc.) don't support this display mode. But in browsers that do (e.g. KHTML-based browsers like Konq and Safari), it's a thing of beauty.

So we need a workaround for Firefox and IE. You could revert to tables if you detect those browsers, but I like to keep the HTML unchanged. You could use float: left, and that works very well unless your blocks are different heights. So you can force your blocks to be the same height, and possibly use overflow: auto to give scrollbars as needed (or hide the overflow or let it just overflow or whatever).

So here's a little example. The blue blocks use display: inline-block and the green blocks use float: left.

Lorem
ipsum
dolor
sit
amet
The
quick
brown
fox
Lorem
ipsum
dolor
sit
amet
The
quick
brown
fox

Do play around with it by resizing your browser and dusting off that Konquerer or Safari browser to see how the blue blocks look when rendered correctly.

I think it's a crying shame that firefox doesn't render this properly. Maybe the complacent table-hugging masses haven't made enough noise. Let's make some noise.

While I'm on the subject, I highly recommend css_browser_selector.js method of doing browser-specific CSS.

1 comment |

Decent Spaces

Posted by Hans Fugal Tue, 06 Nov 2007 19:30:35 GMT

One of the more drool-inducing features of Leopard (for geeks, anyway) is Spaces, Apple's virtual desktop implementation. I'm a big virtual desktop fan, and I'm glad to see it working its way into the mainstream. And all things considered, Spaces is a decent (and beautiful) implementation.

But there are some bugs. I hope that we will see them worked out. Some of the bugs are in Spaces itself, some are probably with 3rd party applications. The most notable, and annoying, problem is buggy application switching. When you cmd-tab to switch applications, you are taken to the space with that application. This is good, but it must have given the Apple developers heartburn because in some ways it flies in the face of the "Apple Way", which thinks of an application as a whole not as independent windows. That's why the menu bar is at the top, and it's behind the design of the dock. But what happens when there's a Terminal window on this Space, and on that Space? The natural thing should be, switch to the terminal window in this Space. If that's not what the user wanted, well you can't be expected to read minds. But when I cmd-tab to Terminal, I am always taken to what Leopard apparently thinks is the master Terminal Space, regardless of whether I have a Terminal window in this space, which Terminal window I last used, etc. Bad news. As a workaround, I just put Terminal on all spaces and thank my lucky stars it has tabs now. This affects most multi-window applications to some degree, but it's most annoying with Terminal and Adium.

On a related note, I'd expect cmd-` to switch between windows of the same app on different Spaces, but it only switches between windows on the current space.

Some applications, especially Firefox and to a lesser extent Thunderbird, have focus bugs that may be related to spaces. Sometimes when I switch to Firefox (with cmd-tab), the window is not in focus and is not brought to the foreground. The menu bar reflects that I'm in Firefox, and I may have moved spaces to get there, but it's in the background. I have to switch to it with cmd-` (or, horror of horrors, with the mouse). I imagine this is the sort of thing that Apple and/or Mozilla will hammer out soon. There are other Firefox irritations but they're for another post—if they haven't been fixed by then.

So far, nothing too surprising. Virtual desktops is hard to get perfect, and various Linux window managers have been floundering for years or even decades. Overall, I'd say they're off to a smashing start. I have two other more minor irritations. First, I'd like the current application to stay the current application when I switch spaces with the keyboard, instead of switching to the topmost application in the new space. This is because I often want to choose an application (by cmd-tabbing to it), then navigate to another space where I want to open a new window (e.g. Terminal). This is a design decision, of course, and one that people tend to fall on either side with about 50% probability. The second is keybindings. I'd like to switch spaces with cmd-ctrl-hjkl (Vim keybindings). Maybe we'll find a way. I'd also like to have more keyboard operations, especially "move me and this window to the {left,right,up,down} space".

2 comments |

Firefox, Close Thyself

Posted by Hans Fugal Tue, 31 Oct 2006 04:43:22 GMT

Firefox 2.0 is pretty slick, but one thing really bugged me. When you close the last tab with command-w, the window stays there. I thought, "hmm, maybe this is a feature not a bug so I'll try it for awhile and maybe I'll like it." I didn't like it. Luckily the fix is not hard. Just uncheck "Always show the tab bar" in the tab preferences pane, and sanity will descend upon your zorro. This is of course completely illogical and uncalled-for. Heck, even an entry in about:config would be better (yes, I looked there). But at least it's controllable.

4 comments |

Iceweasel

Posted by Hans Fugal Wed, 11 Oct 2006 03:56:41 GMT

In case you haven't heard, Debian is planning on renaming Firefox to Iceweasel in its upcoming December release, codenamed Etch. The argument between Debian and Mozilla has been raging for quite some time now, and it appears they've reached a stalemate and so they will be doing the only thing they can do.

To recap, Debian won't distribute the Firefox and Thunderbird icons because they're copyrighted with a non-free license. Mozilla won't permit the use of its trademarked names if the official icons aren't used. Also, Mozilla wants complete control over the software, meaning Debian can't apply any patches of its own that haven't been approved by Ye Olde Mozilla. This is free software we're talking about right?

This phrase is repeated over and over when discussing the disagreement: "Mozilla understandably wants to maintain control and blah blah blah blah." Well I'm sorry, but while I can understand Mozilla's reasoning I can't agree with it and I do not have sympathy for them. Firefox and Thunderbird are big projects, but there have been a lot of bigger projects that have gone before who have not had issues with quality control and have not resorted to trademark bullying. Like, oh, the Linux kernel itself. Firefox will simply not ever have the variability that the Linux kernel has from distro to distro, no matter what distribution starts patching it. You don't see Linus throwing around his weight forcing people to distribute sanctioned vanilla kernels with Tux bootsplash images, or else.

Is Debian being anal? Well, yes. That's what Debian does, so people who need that assurance of utter freedom can sleep well at night. Debian has been around for a long time, and its guidelines haven't changed. They're like laws of nature. Mozilla is being a prick. Mozilla doesn't have to be a prick, but it certainly is being consistent with past behavior (I'm thinking of the Adobe SVG plugin scandal). It looks like Iceweasel is here to stay.

I'm divided on what happens next. I want Iceweasel to be released and be the name of the browser on Debian and Ubuntu for the next two years, because it will serve Mozilla right for being pricks. But, the responsible side of me says that can only be bad for everybody and hopes that Mozilla and Debian can come to some sort of agreement. Besides, I really like the Firefox and Thunderbird icons.

Read more at LWN

Iceweasel proposed icon

no comments |