Text Size Increase problem in Safari

[Sumeet Chawla]

Hello Friends,
I coded this site sometime back and someone pointed out this problem to me now. After I increase the text size, the whole layout get’s messy. It only happens in safari. When I do it in IE, Chrome or Firefox, the whole layout/site increases gracefully. But in safari, all the divs remain the same size and only the text size increases :| Is there any solution for fixing this on safari?

Thank you,

~Sumeet Chawla

[TheDoc]

That is exactly how it should be working.

There are two different zoom options. One is a text-resize, and the other literally just zooms into the page. Some browsers default to different things. If you’re seeing the divs change size too, it means it’s on "page zoom". If only the text changes, it’s on "text-only zoom".

[Sumeet Chawla]

Thanks doc for that info. So basically, Safari only supports text increase? The thing is that if I increase the text size in Safari the text gets overlapped and goes out of the div.. Is that normal for a website using DIV layouts or did I miss out on something?

[TheDoc]

No, Safari supports both types of zoom.

Generally, you should be able to increase the text size twice without breaking a layout of a site. If you can only go once, that’s not too bad, but you should really aim for two.

If your text is going outside of the div, I assume the div has a fixed width/height, so there’s really no way of getting around that. Do you have an example?

[Sumeet Chawla]

Ah, I see.. Yea, I knew that with fixed height and width the layout will break.. But I didn’t know that there are two kinds of zoom :P
Thanks.
Here is a preview of the site I was talking about. It has a fixed width height because of the design. Its a static, brochure site.

http://code-pal.com/codepal-old/o&c-website/

[Author]

Posts