Arial…

Strictly, not a coding thing, but it’s about font style. How to Spot Arial and The Scourge of Arial are interesting reads.

For years now I’ve been interested in typography. It seems to me that it’s one of those overlooked things – that web page looks okay, until someone who knows about type works on it, and then it looks great.

I agree with the article, I don’t like Arial – the weight of the top of the ‘a’ seems wrong. Not sure what to use instead – at the moment I use Tahoma and Trebuchet a lot, but I’m not entirely happy with either. And yes, I’m sticking with the free fonts – I’m not a specialist, I ain’t paying for fonts (blimey but some of them cost…)

Arial…

How to use :hover on more than just links…

Peterned has a good idea for getting the :Hover of an element to work properly – use HTC files.

Good browsers (Mozilla, Opera and the like) allow you do define a style for hovering over, well, nearly any item. Naturally, Internet Explorer only supports a:hover – that is, hover for anchor tags. This sucks, and Peterned has written an HTC file that will, if the client is IE, rewrite the styles dynamically and assign the appropriate functionality to them.

Pretty cool.

How to use :hover on more than just links…

Working on Web UI Components

So, this whole ‘Ajax’ thing set me thinking – why not try to make all ‘normal’ user interface components – date, numeric, combo boxes, autosuggestion boxes, image rollovers, menus, tooltips, etc. – why not make them all into libraries that you can include in a page, and then configure through the attributes of a node. E.g.
<input name='someDate' type='text' value='' subtype='date'
format='yyyy-mm-ddd'>

Then the .js file you include reads inputs, finds dates, and add the functionality you need.

I’ve already done this for combo boxes – I’ll put it on my site soon – and so I started looking into menus, and found some neat things:

I didn’t know you could do so much with CSS. Clearly, it has come along since I last really got stuck into it!

Working on Web UI Components

Vertical Text in Internet Explorer

 

Vertical Text

CSS seems to lack an real control over text direction – it should, but of course the reality is different.

What I found was a way of making vertical in IE using some of those pointless filters, and the support IE has for top to bottom, right to left languages. It’s a bit sneaky in doing this – but it works in IE, at least. I haven’t found a way of doing it in Mozilla.
<div style="{ writing-mode:tb-rl;
filter: flipv fliph;
white-space: nowrap;}">

Vertical Text in Internet Explorer