When designing by mobile page for should I use percentages and relative code instead of absolute measurements to cater for all
screen sizes?
correct
In most cases you should always be using relative measurements. Not only in terms of mobile targeting but desktop as well. That creates a design that is much more likely to adapt to different user preferences and devices retaining its over all look and feel.
Excellent that means i am on the write track however my heights are in px i will have to set them to %. What about fonts size are there any recommended range of ems it should be?
The default font size is 1em, which could be anything but generally speaking its around 14 – 18px. In most cases its about 16px. So if you would like to have an outer wrapper that is ~960px you would use 960/16 which yields 60em.
That won’t work, as %height is a misleading concept*. Ideally, avoid setting heights on anything (except in special circumstances) as it is just a recipe for trouble. Better to let elements set their own heights in most cases.
* Somewhere along the line you have to set a height in a fixed measurement to allow %height on inner elements to mean anything.