Firefox 4 beta is a nice browser. I’ve been using it for a couple of weeks, and prefer it over the earlier versions. It seems a bit more stable, and has some nice features around tabs that are worth switching for. Unfortunately, there are also some drawbacks to the current version.
One example that’s been on my mind recently has to do with trimming text to fit a container. Firefox 3 and earlier versions supported a nice (from the layout perspective) feature that allowed a combination of CSS properties to specify that text should be displayed to fit the width a div, and anything that didn’t fit should just be skipped. This made it possible to display variable amounts of text without worrying about misalignment and overflow. The CSS required to achieve this was pretty simple:
Now, with version 4 of Firefox, this feature has been removed. While there are apparently sound reasons for doing this, the manner in which the change was executed was not ideal.
There are three problems with the FF 4 implementation:
- With the -moz-binding attribute specified, the text of the associated element is not displayed.
- There seems to be no workaround.
- There was no clear indication of this in the changes announced with respect to this version.
While it is reasonable to build a more secure and standards-compliant browser, there ought to be mechanisms through which useful (and used) functionality is preserved, or workarounds provided. The current behavior — include the element and no text shows; exclude the element and the other properties don’t function as implied — is not good engineering. If all the -moz-binding element was intended to do was append the ellipsis the trimmed text, not including that property should not affect the trimming of the text. And including it should certainly not cause text to disappear.