CSS tricks in both dimensions
Cameron Adams and Dave Shea both came through recently with some smart new CSS techniques.
Cameron’s trick, entitled Resolution dependent layout, provides a welcome new angle to the long running debate over liquid vs. fixed width designs. The standard dilemma is that fixed width designs waste browser real estate, but liquid designs can lead to unreadably long lines of text. The CSS specification provides a solution in the form of the max-width property, but this is unsupported by Internet Explorer (barring clever but invalid expression hacks) and can still leave liquid designs looking less than optimal in uncommonly wide or narrow browser windows.
Dave Shea on the other hand has been working vertically: in min-height: fixed; he takes on the sticky problem of design elements which need to maintain a certain height, but expand when their content outgrows them. Dave’s eventual solution is a veritable tour de force of CSS browser hacks, with workarounds for IE on Windows and Mac, Opera 7 and Safari! The trade-offs involved in using so many hacks are discussed intelligently in Dave’s comments. As always, I would caution designers to make sure they are fully aware of the hacks in use and what they do before applying the technique to a live project.