treehouse : what would you like to learn today?
Web Design Web Development iOS Development

[Solved] Should I Care About Making My Site Fit on 1024x768 Resolution?

  • My website fits normally on all resolutions above 1024x768. But it does not entirely fit on that resolution or bellow. Should i go the extra mile to make my website compatible on that resolution as well? or does barely anyone have that resolution?

  • Sadly enough, way too many use resolutions like 1024x768, and even lower. Company computers, cellphones, iPad and so on. If it's a big problem for you to redesign it, I would go with it as-is and check screen sizes with Google Analytics too see what screen sizes your users uses.

    Otherwise, a pair of media-queries should do the job!

  • @limex it actually fits perfectly fine on all smartphones and tablets. But i'm not sure if its worth making it fit on 1024x768

  • You should just do something like

      .page-wrap {
          width: 100%;
          max-width: 1024px;
      }
    

    this way it degrades gracefully. From there, you would just fix the issues via media queries.

  • Are you using fixed widths at different breakpoints?

    Realistically the smartest way to build responsively is to use percentage based widths and simply (as @chrisburton said) stick a max-width on for the top end.

    That way you're ensuring it will look tasty on all screen sizes, rather than just suiting particular ones.

  • it actually fits perfectly fine on all smartphones and tablets. But i'm not sure if its worth making it fit on 1024x768

    @Jarolin - I'm not sure I follow that statement. There are plenty of smartphones (even some tablets) that are smaller than 1024x768...?

  • @traq Well i used browserstack.com and tested it on most android devices and iphones, and the website fits fine on all. i'm not sure how but it does.

  • probably just "zoomed out" (many tablets will do that by default unless you specify how the site should be viewed on mobile devices).

    Opera has a good introduction to these concepts.

  • The body frame of my site is 1000px. Is that too much?

  • The body frame of my site is 1000px. Is that too much?

    Why are you still using px? Make the frame a percentage of the viewport, let the browser render it for the device adjusting for device widths with media queries.