Lemur — Thu, 23 Aug 2007 14:23:21 +0000

Think i have got it!?

Thanks for your help, much appreciated!

Regards,
Lee

webwiz — Tue, 21 Aug 2007 21:25:57 +0000

Hi Lemur,
I don't see a problem in Firefox, if that's what you meant. Where is the margin-top not being applied?

I see you have abandoned tables for a CSS layout. Good for you. You may not need as many CSS rules as you think. Take a look at my effort to do the same thing:

Also, I don't see why you can't use ems to resize just about any image. Just make the width and height in ems proportional to the pixel sizes. Anyway, you are going for a fixed pixel layout, so my suggestion may not work for you.

One more idea, though: Make the image a background image, then you can make the box a fixed size, hiding any excess width or height and matching it up perfectly.

Lemur — Tue, 21 Aug 2007 10:58:12 +0000

Thanks David!

This will not be any use to me because this image is not the final image, i plan to have a random image script in its place.

So back to the drawing board it was and i have decided to do the site using div boxes. I have never done this before so its something new and i have run into 1 probem so far.

Margin-top:0px; is not working in firework, is there anyway round it?

this is what i have so far;

Regards,
Lee

webwiz — Mon, 20 Aug 2007 19:13:16 +0000

Hi Lemur,
In brief, you can't. Text can be resized, and there are browser differences in verical spacing of text, as you have discovered. There is categorically no relationship between text size on your visitor's computer and the pixel size of an image, despite assertions to the contrary.

Having said that, there are a couple of solutions that come to mind:

1) You could give the cell containing the image a background colour that matches the image's, and vertically center the image;

2) You can size the image using EMs (via the style sheet) to match the size of the navigation (also sized vertically in EMs). You would need a larger image if you want to keep the quality, though. Enlarged images usually look ugly.