[thelist] WinXP, IE7 and CSS
Mark Groen
evolt at markgroen.com
Sat Apr 7 15:06:54 CDT 2007
> On Thursday 05 April 2007 18:04, kasimir-k wrote:
> > kasimir-k scribeva in 06/04/2007 0:49:
> > > On XP Home
> > > IE7 http://kasimir-k.net/cmmc-ie7.png
> > > Firefox 2 http://kasimir-k.net/cmmc-ff2.png
> > >
> > > note on ie7: view -> text size -> medium
> > > the form doesn't look quite right
> >
> > Ah, it's the text size...
> > http://kasimir-k.net/cmmc-ie7-2.png with view -> text size -> smaller
> > and
> > http://kasimir-k.net/cmmc-ff2-2.png with one step increased text size
> >
> > Your background images probably not playing nice with your ems or
> > something.
>
> Very interesting... gives me something to go on for a Google search,
> hopefully I'll get another reply as to the fix, thanks!
Appears that Internet Explorer 6 and 7 has some oddness to watch for, and it
may change how some people do their CSS layouts.
If the default text size is not default, View > Text Size > Smaller for
example is set, both versions will apply a smaller value to *anything* that
has been specified in ems, not just text and not uniformly. A div that is set
24ems wide will be smaller than what you would expect it to be, and most
likely your nice CSS layout will be messy.
For this project I've created a new style sheet that has the divs used for
layout specified in pixels instead of ems. This breaks Firefox's zoom
feature, in that a Ctrl + will only increase the text size instead of the
whole page, as it would if everything was relative units. One can use
conditional comments to feed an entirely different style sheet to Firefox, it
does mean extra work keeping both brands happy if you want to see the same
zoom page behaviour.
<tip type="css">
If you have an href that uses padding like a list item button in a menu,
preceeding the padding declaration with the style: zoom:100%; should ensure
the new zoom feature in Internet Explorer 7 works properly on your links.
</tip>
--
cheers,
mark
More information about the thelist
mailing list