Friday, August 29

Horizontal Scrolling

Came across this article on Smashing Magazine, it got me thinking.

How many internet users use a scrolling mouse, and actually use the scroll wheel?

It looks potentially like a really nice alternate way of presenting a website. Perhaps using it, with changes in the pipeline for CSS, would enable us to create horizontal-read columns a la magazine or newspaper. But a few tricks will have to be found with the behaviour of 'height:' and 'width:' otherwise smaller screens will vertically scroll, and larger screens will have lots of empty space (try this).

Certainly got me thinking of new possibilities for the web... :)

Labels: ,

Thursday, August 7

Internet Explorer rowspan nightmare

Whilst working on some email templates the other day I found another Internet Explorer annoyance (bug?).

HTML emails are difficult to create because of the varying standards employed across email clients. And with Outlook 2007 that has dropped CSS support back something like 5 years, I decided to go back to basics - tables based layout, that'd work surely?

Nope, well not how I wanted them to.

The problem is, when you have a fixed sized cell and a cell in the column next to it spans more than one row, and a fluid width on that rowspan-ed column - the height of the 'fixed' cell becomes fluid. I did a mockup here, try resizing the page in Internet Explorer and see the red cell's height change once the text starts overflowing into the second row.

This isn't always a problem because you can easily put a nested table into the red cell to constrain it to the fixed dimensions. However imagine you are trying to line up images to create your design. and you need the bottom of the red cell column to marry up with the bottom of the 2nd column. Well it's beat me anyway....

Labels: , , ,

Friday, August 1

CSS Graphs

At work I found myself needing to create some graphs from queries on a MySQL database. Having a search and generally not liking to creating images on the fly I stumbled upon this article. The method uses just an unordered list, and CSS. The only thing missing would be axes - any suggestions?

Labels: