Page Layout Changes with Monitor Settings

[Craig Robbo]

Hi

My site is running at a fixed page width of 906px with the sideboxes set at 150px. Which is fine on most PC's.

However when my laptop's monitor settings are set to 120 DPI instead of the standard 96 DPI my sideboxes appear to change size (they are set to 150px in admin) and my whole page goes askew.

My laptop is running Vista and IE7. I cannot get the problem to replicate in Firefox which makes it hard to find the answer.

My site can be found at http://www.imagocollections.com.au/i...index&cPath=33

Any Help would be really appreciated as I wont be able to go live until I get it fixed.

Thanks

Craig

[gjh42]

What happens if you change the sidebox width spec from px to em? On a default ZC installation, 1em = 10px for the base. Your ratio may vary, but that would be a reasonable start.

px is a monitor-specific dimension, while em is relative only to the displayed font size. If someone makes fonts bigger in their browser, em sizes will increase the same.

[yellow1912]

http://www.scantips.com/basics1c.html

[Craig Robbo]

Hi

Many thanks to both of you again.

I tried setting the sideboxes in admin (also tried it in the stylesheet) to em without success. I also tried setting the main page width to various em settings as well.

It does seem to be that the font size is increasing disproportionally to the rest of the page (the word 'day dresses' takes up 2 lines at 120 DPI but only 1 line at 96 DPI).

It wouldn't be something like setting the font size to a fixed value in the stylesheet instead of a % would it?

[Craig Robbo]

Tried setting all the body font size to a small % - this got rid of the line break but didn't fix the page width problem so there may be 2 issues here?

The page width seems to change dependant on whats in the centre column i.e. with the main womens image there will be a white space added to the right side of the page whereas on the product page there will be a white space to the right where the centre column seems to have shrunk.

I dont want to cloud the issue any further but i'm also missing a right border on my left sidebox in Firefox - not sure if it's related.

Thanks

Craig

[tony_sar]

you may want to look at this blog

http://www.williamkolean.com/williamblog/?p=18

[Craig Robbo]

Thanks for that.

Tried putting ": expression(screen.deviceXDPI > 96 ? 1000 / ((screen.deviceXDPI / 96) * 16) + “%” : “62.5%”);" into my body font size as the blog suggested but this just made the font at 120 DPI even bigger. The page layout problem didn't change so I'm not sure if its related??

Thanks again though.

Craig