9 {{ upvoteCount | shortNum }}
9 {{ upvoteCount | shortNum }}

Website looks different on other computers

by man5
7 replies
  • WEB DESIGN
    • |
My website is within 900 x 1000 px range. It looks perfect on my computer and even ma bro's computer who has the same flat screen LCD monitor. But today I went on it from another computer with a different screen and resolution. My website is not centerd, or i have to scroll to the right to bring it in center and it is enlarged.

So what I want to know is, did I do something wrong or is it that person's fault my website shows up like that? My website looks the same in IE as it does in Firefox...on my computer. But I assume people with different computer screens and resolutions will view it differently.

But how come youtube and every other website shows up correctly no matter the size of your screen?
#computers #website
  • Profile picture of the author Headfirst
    It depends on the way you designed it. 900x1000 is an odd resolution to design for. Do you have a link to the site?
    Signature
    Golf Outing Sponsor Signs, Banners and Flags||Plymouth, MI Marketing || Plymouth Dentist
    {{ DiscussionBoard.errors[3215399].message }}
    • Profile picture of the author piper97
      A screen with a pixel width less than the width of your site will behave exactly as you described. If someone views your site on on 800 pixel wide screen they will see the first 800 pixels of your site starting from the left side. To center your site in the screen they will need to move the scroll bar to the right approximately 100 pixels (for a 1000 pixel wide site). However, they will not be able to see the left and right extremities of your site (100 pixels each side). Also since they have taken the 800 pixels and displayed them on a screen with a similar physical size to your screen the content contained in those 800 pixels will look larger.

      There are still people out there with low resolution screens but the percentage below 1024 pixels is quite low now. It probably isn't worth designing a narrower site to cover these occasional visitors. You will lose a lot of your site real estate and it will look quite narrow on modern day screens.
      Signature

      {{ DiscussionBoard.errors[3215563].message }}
      • Profile picture of the author man5
        I ment to say 975 x1000 px.

        But yes piper, thank a lot for that detailed message. That clears it up.

        btw, my site is in my sig. Check it out.
        Signature
        www.imdabest.ca
        {{ DiscussionBoard.errors[3215648].message }}
  • Profile picture of the author signity2
    i think its just bcoz of different explorer it occurs sometime due to some php coding
    {{ DiscussionBoard.errors[3229015].message }}
  • Profile picture of the author eQuus
    Different browsers also will display your page differently.
    {{ DiscussionBoard.errors[3230317].message }}
  • Profile picture of the author SteveJohnson
    It's your fault.

    You're using absolute positioning on everything - you're site will always be at least 500px from the left side of ANY monitor.

    You need to redo the layout using auto margins and set widths in order to center content on the screen.
    Signature

    The 2nd Amendment, 1789 - The Original Homeland Security.

    Gun control means never having to say, "I missed you."

    {{ DiscussionBoard.errors[3230839].message }}
    • Profile picture of the author RichKent
      Wow, what a mess. As steve said, you used absolute positioning on everything - means you told everything where to be in relation to the browser window, so the footer is always 499px from the left and 821px from the top.

      What you need to do is get rid of all the absolute positioning stuff, then put everything in a 'wrapper' div. I literally use <div id="wrapper"> and then create centered positioning on the wrapper div in your css file like this:

      #wrapper {margin: 0 auto;}

      That will make the top and bottom margins 0, and auto-center the sides. I also set my site width in the wrapper so I don't have to set the width in a bunch of places -

      #wrapper {margin: 0 auto;width:980px;}

      or whatever your width is. hope that helps!
      Signature
      Learn more about Wordpress and SEO
      {{ DiscussionBoard.errors[3231044].message }}

Trending Topics