Zoom out entire site

Get Started
1

Hi there.

My site is zamirkassam.com

I’m trying to resize the entire site by using this CSS:

div { zoom: 95% }

After I make the change, all the slider images disappear in internet explorer (and internet explorer is the main reason that I’m resizing in the first place).

Any tips or suggestions to making the entire site smaller? (as if pressing ctrl -)

Thanks

2

Hi, I’m viewing the page in IE6/7/8/9, viewing besides FF (I can provide screenshots) and all the slider images are showing (I assume all, it’s rotating through) proportionately.

3

Sorry, I guess it’s confusing. I don’t want to actually make the style change until I know the correct way to do it.

Here’s a screenshot of what it looks like when I make the change:

Imgur

But I’m really wondering if this is even the best way to do it? It seems like it’s kind of messing up the formatting if I add only:

div { zoom: 95% }

The site loses it’s structure

4

Well let me ask you this question, is the difference in IE worth it to even bother attempting this?

I say that because, as mentioned before, I had all the versions up running against FF. I noticed almost no change in regards to the page size, text size, layout, etc. If there was any (I can’t remember, as it was a few hours ago), it most definitely wasn’t bad enough for myself to make a mental note of it.

5

I hate everything about IE, but it’s what my client is using so it needs to be fixed.

I’ve figured out the zoom part. It works now and the images are fine.

But the <body> looks like it’s aligned left in I.E. (whereas centered in other browsers). Not a huge issue, but I’m trying to figure it out now.

Will start a new thread for this. thanks

6

Good job figuring it out :). What did you do to fix it? I’ll check out your other thread now.

7

My question would be why are you using the IE specific only property ZOOM on a layout in the first place as anything but a haslayout trigger? I mean, if it’s written properly don’t you want it the SAME size in all browsers? Or are you having the problem of size inheritance being broken in tables or something.

You’d be better off worrying about ACTUAL accessibility issues like the fixed width layout and uselessly undersized fixed metric (px) fonts… since I have to zoom in 40% to even approach legible on my desktop and the fixed width is too big for my netbook – and it’s not like zooming out is even an option.

Of course being a Wordpress based site, you’re pretty well nebfered on the markup in the first place, what with the endless and pointless wrapping elements and classes for nothing… but still you could at least open it up semi-fluid and set the file sizes to something useful that would auto-expand.

Though that would point out precisely why I consider things like that rotating banner image to not be viable concepts in web design, since it can’t automatically expand in height to fit different sized content… or auto enlarge on width/auto-shrink on width for different devices of differing capabilities.