CSS Tips and tricks…

I was just working with Tom on trying to get some CSS to work properly for a project he’s working on.

The problem was divs flowing outside their parents. I was reminded of some pages I used to have up which demonstrate various div layout issues and show some fixes. I have now added them back into this site and they are here.

They key point for quite a few of the solutions there and hopefully for Toms’ solution (except its not quite finished yet) was that sometimes if you have some floats knowing around, it can be useful to have another, empty div with a style set to clear:both; this forces the floating to stop and makes the parent div expand (or should do anyway).

Oh yeah, an important resource that helped me to solve these problems was Eric Meyer’s site.


URI not URL (it is deprecated)

I have been asked about this a few times, I had learned from Jim that it had been deprecated but thought it would be useful to provide the documentation to demonstrate it.

This apache doc gives a good summary :

Which points you to :

Basically URL is a subset of URI which

… in addition to identifying a resource, provide a means of locating the resource by describing its primary access mechanism (e.g., its network “location”)



Multiple image sizing…

You would have thought this was the easiest thing in the world!

anyway after 1.5 hours trying various offerings i finally found this:


Which does exactly what you want. Simply drag a load of images on it and then resize them!!!!

It does however seem to reduce the quality a little, think i should have started out with png files rather than gifs.

Anyway i now have a way to put an entire presentation including effects on the web.

Simply view it and press COMMAND + SHIFT + 3 and OS X will save a picture to the desktop. Have to give it chance to catch up between shots.

Then can resize them with the above software and then rename them all – need a script for this but am to tired of software nonsense for one night!

Posted in web