Expression > Forums - Accueil > Expression Web and SuperPreview > Can someone tell me why my Contacts page jumps a few pixels to the right?
Poser une questionPoser une question
 

TraitéeCan someone tell me why my Contacts page jumps a few pixels to the right?

Réponses

  • jeudi 2 juillet 2009 16:11Bill Pearson Médailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateur
     Traitée
    It only jumps if the footer isn't displayed on the screen. On my monitor (20"), it doesn't jump if I have the viewport maximized (the footer is displayed on all pages). But if I shrink the height so that the viewport is 990px, all of the regular pages except Links (the tallest page) hop to the right by about 8px.

    I see a couple of problems in your CSS. You are mixing size specification between px and %. When you have things like 1% padding, that's asking for problems, because the math doesn't always calculate to an even number, which can cause hopping. Get rid of all % settings for margins and use a fixed px width.

    Also, you have on #environment a margin set to 3.5px auto. A monitor can't align to part of a pixel. Use whole numbers only.

    Also, also, Calibri is a font available only in Vista and Office 2007. Nobody else has that font loaded on their computer, and you haven't given a font family to fall back on. You don't know what they'll be seeing if they have Win XP, Mac, etc.

    Edit: I was looking at the CSS for problems and didn't notice nor think about the scroll bar issue, which is so very ubiquitous. Forest for the trees, and all, right? Thanks Ian for pointing out the forest.

Toutes les réponses

  • jeudi 2 juillet 2009 15:10VeignMVPMédailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateur
     
    Didn't you already ask this question?  I can't remember what was mentioned before, in the previous thread, about your jumping issues.
    --
    Chris Hanscom - Microsoft MVP
    Resource Center | Veign's Blog | Web Development Help

    Get a Complete Website Analysis by Veign
  • jeudi 2 juillet 2009 15:14fcphdJim Médailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateur
     
    It works fine in FF for me - no jump at all.

    Jim
  • jeudi 2 juillet 2009 15:48rboutin1 Médailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateur
     
    Didn't you already ask this question?  I can't remember what was mentioned before, in the previous thread, about your jumping issues.
    --
    Chris Hanscom - Microsoft MVP
    Resource Center | Veign's Blog | Web Development Help

    Get a Complete Website Analysis by Veign

    No, the last one was about an image that was moving within the page.  My issue now is that an entire page is moving.  I'm confused because it is the master layout, I can't figure out why one page would be different.  I saw the previous post that someone saw no issue using FF.  I'll check using a different computer.
  • jeudi 2 juillet 2009 15:51VeignMVPMédailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateur
     
    I also see no jump in FF.  If one page jumps for you and one does not compare the two pages to find the differences.  Also, if the previous thread solved the image jumping issue then it may be a very similar situation why the entire content jumps.
    --
    Chris Hanscom - Microsoft MVP
    Resource Center | Veign's Blog | Web Development Help

    Get a Complete Website Analysis by Veign
  • jeudi 2 juillet 2009 16:04Ian HaynesMVPMédailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateur
     Réponse proposée

    The only jump I see is in IE8 when viewed in a small browser window. The home page requires a vertical scroll, the contact page doesn't, so the content moves right to occupy the space previously taking up by the browsers vertical scroll bar. This doesn't happen in FF but does in Chrome.

    Ian
    MS MVP Expression

    http://www.ew-resource.co.uk
    http://www.fp-resource.co.uk


    Ian Haynes
    • Proposé comme réponseIan HaynesMVPvendredi 3 juillet 2009 07:06
    •  
  • jeudi 2 juillet 2009 16:11Bill Pearson Médailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateur
     Traitée
    It only jumps if the footer isn't displayed on the screen. On my monitor (20"), it doesn't jump if I have the viewport maximized (the footer is displayed on all pages). But if I shrink the height so that the viewport is 990px, all of the regular pages except Links (the tallest page) hop to the right by about 8px.

    I see a couple of problems in your CSS. You are mixing size specification between px and %. When you have things like 1% padding, that's asking for problems, because the math doesn't always calculate to an even number, which can cause hopping. Get rid of all % settings for margins and use a fixed px width.

    Also, you have on #environment a margin set to 3.5px auto. A monitor can't align to part of a pixel. Use whole numbers only.

    Also, also, Calibri is a font available only in Vista and Office 2007. Nobody else has that font loaded on their computer, and you haven't given a font family to fall back on. You don't know what they'll be seeing if they have Win XP, Mac, etc.

    Edit: I was looking at the CSS for problems and didn't notice nor think about the scroll bar issue, which is so very ubiquitous. Forest for the trees, and all, right? Thanks Ian for pointing out the forest.
  • jeudi 2 juillet 2009 16:24rboutin1 Médailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateurMédailles de l'utilisateur
     
    Thanks guys.  I have A LOT to learn......