Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    Regular Coder
    Join Date
    Mar 2005
    Posts
    111
    Thanks
    0
    Thanked 0 Times in 0 Posts

    content moving to the left

    if you go to http://mh-interactive.com/index.html
    and look at the position of everything on the page, then click the contact link on the navigation you will notice that everything shifts slightly to the left and I can't figure out why
    any one wanna help?

    edit: it seems to only happen in firefox

  • #2
    Senior Coder Arbitrator's Avatar
    Join Date
    Mar 2006
    Location
    Splendora, Texas, United States of America
    Posts
    3,304
    Thanks
    28
    Thanked 276 Times in 270 Posts
    The displacement is occurring because the extra content causes the scrollbar to appear. In order to keep your layout centered, Firefox is adjusting the position of your layout since you're using a percentage (I believe). To fix this try changing the properties of #container to:

    Code:
    div#container {
      width: 528px;
      position: relative; 
      margin: XXX auto 0 auto; /* where XXX is the height from the top of the page */
      padding: 0 9px 0 11px;
      }
    What I basically did is used the usual margin-left: auto; margin-right: auto; to center your layout instead. As an added note, you don't need to specify units when a value is zero since 0px, 0em, 0pt, et cetera are all the same thing: zero.
    For every complex problem, there is an answer that is clear, simple, and wrong.

  • #3
    Regular Coder
    Join Date
    Mar 2005
    Posts
    111
    Thanks
    0
    Thanked 0 Times in 0 Posts
    sweet that worked thanks

  • #4
    Senior Coder Arbitrator's Avatar
    Join Date
    Mar 2006
    Location
    Splendora, Texas, United States of America
    Posts
    3,304
    Thanks
    28
    Thanked 276 Times in 270 Posts
    Actually you don't even need that position: relative; in there; I forgot to remove it, heh.
    For every complex problem, there is an answer that is clear, simple, and wrong.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •