IE7 zoom messes up horizontal lists

Discussion in 'HTML' started by patrick j, Nov 4, 2006.

  1. patrick j

    patrick j Guest

    Hi

    I've just discovered that IE 7 messes up horizontal lists.

    I've done a bit of searching the web but a solution has not sprung
    forth from this searching.

    Below is a url with a horizontal list:

    <http://css.maxdesign.com.au/index.htm>

    With IE 7 all looks very well at 100% but increase the zoom to 125% or
    150% then all the text in the list crushes together but the positions
    of the links seem to remain in scale with the zooming. What you have is
    a jolly mess :(

    I'm wondering if there are any horizontal list experts who know of a
    solution to this one?

    Thank you :)
    --
    Patrick
    Brighton, UK

    <http://www.patrickjames.me.uk>
     
    patrick j, Nov 4, 2006
    #1
    1. Advertising

  2. patrick j

    Els Guest

    patrick j wrote:

    > Hi
    >
    > I've just discovered that IE 7 messes up horizontal lists.
    >
    > I've done a bit of searching the web but a solution has not sprung
    > forth from this searching.
    >
    > Below is a url with a horizontal list:
    >
    > <http://css.maxdesign.com.au/index.htm>
    >
    > With IE 7 all looks very well at 100% but increase the zoom to 125% or
    > 150% then all the text in the list crushes together but the positions
    > of the links seem to remain in scale with the zooming. What you have is
    > a jolly mess :(


    I don't see that happening at all, actually. Not on that page anyway.
    I've seen slight problems with page-zoom, especially when images and
    text are mixed, but horizontal lists like this don't show any problem
    on my IE7.

    > I'm wondering if there are any horizontal list experts who know of a
    > solution to this one?


    No problem, no solution ;-)

    --
    Els http://locusmeus.com/
    accessible web design: http://locusoptimus.com/
     
    Els, Nov 4, 2006
    #2
    1. Advertising

  3. patrick j

    Evertjan. Guest

    Els wrote on 04 nov 2006 in comp.infosystems.www.authoring.stylesheets:

    > patrick j wrote:
    >
    >> Hi
    >>
    >> I've just discovered that IE 7 messes up horizontal lists.
    >>
    >> I've done a bit of searching the web but a solution has not sprung
    >> forth from this searching.
    >>
    >> Below is a url with a horizontal list:
    >>
    >> <http://css.maxdesign.com.au/index.htm>
    >>
    >> With IE 7 all looks very well at 100% but increase the zoom to 125% or
    >> 150% then all the text in the list crushes together but the positions
    >> of the links seem to remain in scale with the zooming. What you have is
    >> a jolly mess :(

    >
    > I don't see that happening at all, actually. Not on that page anyway.
    > I've seen slight problems with page-zoom, especially when images and
    > text are mixed, but horizontal lists like this don't show any problem
    > on my IE7.
    >
    >> I'm wondering if there are any horizontal list experts who know of a
    >> solution to this one?

    >
    > No problem, no solution ;-)


    Oh but they do echt wel, Els.

    Zoom to 125% and then hover over the celtral words.


    --
    Evertjan.
    The Netherlands.
    (Please change the x'es to dots in my emailaddress)
     
    Evertjan., Nov 4, 2006
    #3
  4. patrick j

    Els Guest

    Evertjan. wrote:

    > Els wrote on 04 nov 2006 in comp.infosystems.www.authoring.stylesheets:
    >
    >> patrick j wrote:
    >>
    >>> Hi
    >>>
    >>> I've just discovered that IE 7 messes up horizontal lists.
    >>>
    >>> I've done a bit of searching the web but a solution has not sprung
    >>> forth from this searching.
    >>>
    >>> Below is a url with a horizontal list:
    >>>
    >>> <http://css.maxdesign.com.au/index.htm>
    >>>
    >>> With IE 7 all looks very well at 100% but increase the zoom to 125% or
    >>> 150% then all the text in the list crushes together but the positions
    >>> of the links seem to remain in scale with the zooming. What you have is
    >>> a jolly mess :(

    >>
    >> I don't see that happening at all, actually. Not on that page anyway.
    >> I've seen slight problems with page-zoom, especially when images and
    >> text are mixed, but horizontal lists like this don't show any problem
    >> on my IE7.
    >>
    >>> I'm wondering if there are any horizontal list experts who know of a
    >>> solution to this one?

    >>
    >> No problem, no solution ;-)

    >
    > Oh but they do echt wel, Els.
    >
    > Zoom to 125% and then hover over the celtral words.


    Yup, see it now.
    Didn't know I was supposed to hover over the words :)
    Clearly a bug, but if I find a solution, I'll post it here.

    --
    Els http://locusmeus.com/
    accessible web design: http://locusoptimus.com/

    Now playing: Depeche Mode - People Are People
     
    Els, Nov 4, 2006
    #4
  5. patrick j

    BootNic Guest

    > patrick j <> wrote:
    > news:
    > Hi
    >
    > I've just discovered that IE 7 messes up horizontal lists.
    >
    > I've done a bit of searching the web but a solution has not sprung
    > forth from this searching.
    >
    > Below is a url with a horizontal list:
    >
    > <http://css.maxdesign.com.au/index.htm>
    >
    > With IE 7 all looks very well at 100% but increase the zoom to 125% or
    > 150% then all the text in the list crushes together but the positions
    > of the links seem to remain in scale with the zooming. What you have
    > is a jolly mess :(
    >
    > I'm wondering if there are any horizontal list experts who know of a
    > solution to this one?


    zoom:100%;
    padding:0 0.3em;

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">

    <html>
    <head>
    <meta http-equiv="content-type" content=
    "text/html; charset=windows-1252">

    <title></title>
    <style type="text/css">
    #nav {
    margin: 0;
    padding: 0;
    }
    #nav li {
    background-color: #ffe;
    display: inline;
    margin: 0 0.3em;
    padding: 0 0.3em;
    }
    #nav li:hover {
    background-color: #fcc;
    }
    #nav, #nav li {
    list-style: none;
    }

    </style>
    <!--[if IE 7]>
    <style type="text/css">
    #nav li {
    padding: 0 0.3em;
    }
    #nav, #nav li {
    zoom: 100%;
    }
    </style>
    <![endif]-->
    </head>

    <body>
    <ul id="nav">
    <li><a href="/listamatic/">Listamatic</a></li>
    <li><a href="/listamatic2/">Listamatic2</a></li>
    <li><a href="/listutorial/">Listutorial</a></li>
    <li><a href="/floatutorial/">Floatutorial</a></li>
    <li><a href="/selectutorial/">Selectutorial</a></li>
    <li><a href="http://www.maxdesign.com.au/book/">Book</a></li>
    </ul>
    </body>
    </html>

    --
    BootNic Saturday, November 04, 2006 10:57 AM

    Nothing is stronger than habit.
    *Ovid*
     
    BootNic, Nov 4, 2006
    #5
  6. patrick j

    Ed Mullen Guest

    patrick j wrote:
    > Hi
    >
    > I've just discovered that IE 7 messes up horizontal lists.
    >
    > I've done a bit of searching the web but a solution has not sprung
    > forth from this searching.
    >
    > Below is a url with a horizontal list:
    >
    > <http://css.maxdesign.com.au/index.htm>
    >
    > With IE 7 all looks very well at 100% but increase the zoom to 125% or
    > 150% then all the text in the list crushes together but the positions
    > of the links seem to remain in scale with the zooming. What you have is
    > a jolly mess :(
    >
    > I'm wondering if there are any horizontal list experts who know of a
    > solution to this one?
    >
    > Thank you :)


    I see the problem on the page you gave. However, I'm not noticing the
    problem you describe in my own menus. But! I do notice another problem
    when zooming in. IE7 is not reforming the page content to fit within
    the viewport: it scrolls horizontally. Happens on every page I've
    tried, all of which scale just fine in Mozilla browsers and Opera.
    Actually, they scale fine in IE7 at 0 zoom when resizing the IE window.
    Weird.

    --
    Ed Mullen
    http://edmullen.net
    http://mozilla.edmullen.net
    http://abington.edmullen.net
    A bird in the hand makes it difficult to blow your nose.
     
    Ed Mullen, Nov 4, 2006
    #6
  7. patrick j

    patrick j Guest

    On Sat, 4 Nov 2006 15:58:00 +0000, BootNic wrote
    (in article <cM23h.4209$>):

    > zoom:100%;
    > padding:0 0.3em;


    Hi

    Thank you; it works, but I don't understand why.

    I've been doing some more searching on the internet but I can't find
    this problem described.

    I've applied it to the horizontal lists in my own web-site.

    What I can't understand is why does simply repeating the "padding"
    declaration in the special style-sheet for IE7 work?

    Is it because it is preceded by the "zoom" declaration?

    To be honest the zoom declaration is a new one on me :)

    What does it do?

    --
    Patrick
    Brighton, UK

    <http://www.patrickjames.me.uk>
     
    patrick j, Nov 5, 2006
    #7
  8. patrick j

    David Guest

    patrick j wrote:
    > On Sat, 4 Nov 2006 15:58:00 +0000, BootNic wrote
    > (in article <cM23h.4209$>):
    >
    > > zoom:100%;
    > > padding:0 0.3em;

    >
    > Hi
    >
    > Thank you; it works, but I don't understand why.
    >
    > I've been doing some more searching on the internet but I can't find
    > this problem described.
    >
    > I've applied it to the horizontal lists in my own web-site.
    >
    > What I can't understand is why does simply repeating the "padding"
    > declaration in the special style-sheet for IE7 work?
    >
    > Is it because it is preceded by the "zoom" declaration?
    >
    > To be honest the zoom declaration is a new one on me :)
    >
    > What does it do?
    >
    > --
    > Patrick
    > Brighton, UK
    >
    > <http://www.patrickjames.me.uk>


    Oh, the IE7 Zoom "feature". MS has admitted that it's broken, but they
    shipped it anyway. Rest assured, your page is not the only one that
    gets messed up with the Zoom feature. It mostly works for many things,
    its image zooming works really well and the cleartype fonts are nice
    but the CSS rendering+zoom combination is simply broken in many places
    and there's not a lot you can do about it.

    Sorry!

    -David
     
    David, Nov 6, 2006
    #8
  9. patrick j

    BootNic Guest

    > patrick j <> wrote:
    > news:
    > On Sat, 4 Nov 2006 15:58:00 +0000, BootNic wrote
    > (in article <cM23h.4209$>):
    >
    >> zoom:100%;
    >> padding:0 0.3em;

    >
    > Hi
    >
    > Thank you; it works, but I don't understand why.
    >
    > I've been doing some more searching on the internet but I can't find
    > this problem described.
    >
    > I've applied it to the horizontal lists in my own web-site.
    >
    > What I can't understand is why does simply repeating the "padding"
    > declaration in the special style-sheet for IE7 work?
    >
    > Is it because it is preceded by the "zoom" declaration?
    >
    > To be honest the zoom declaration is a new one on me :)
    >
    > What does it do?


    It just needs enough padding to keep the text from jumping out as it
    is zoomed, no need to declare it again if the padding is sufficient in the
    your css.

    zoom: is an IE thing, been around since IE5 I think.

    Setting zoom is what is making it behave.

    --
    BootNic Sunday, November 05, 2006 8:50 PM

    Facts do not cease to exist because they are ignored.
    *Aldous Huxley*
     
    BootNic, Nov 6, 2006
    #9
  10. patrick j

    patrick j Guest

    On Mon, 6 Nov 2006 01:51:33 +0000, BootNic wrote
    (in article <Fyw3h.2408$>):

    > It just needs enough padding to keep the text from jumping out as it
    > is zoomed, no need to declare it again if the padding is sufficient in the
    > your css.
    >
    > zoom: is an IE thing, been around since IE5 I think.
    >
    > Setting zoom is what is making it behave.


    Thank you. I understand now :)

    --
    Patrick
    Brighton, UK

    <http://www.patrickjames.me.uk>
     
    patrick j, Nov 6, 2006
    #10
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Replies:
    1
    Views:
    765
    Keith James
    Feb 14, 2005
  2. Replies:
    1
    Views:
    561
    jfalt
    Feb 15, 2005
  3. Replies:
    0
    Views:
    440
  4. Replies:
    0
    Views:
    351
  5. Arto Steiner

    IE7, zoom and horizontal menu (CSS)

    Arto Steiner, May 24, 2007, in forum: HTML
    Replies:
    1
    Views:
    826
    BootNic
    May 25, 2007
Loading...

Share This Page