Skip navigation
Currently Being Moderated

Adusting website to different screen resolutions

Jul 29, 2012 1:02 AM

Tags: #help #resolution #adobe #website #mac #cs5.5 #dreamweaver #screen #css #code

Im currently designing http://www.allenkey.com.au and i have no idea how to make the website appear the same on all screens because depending on the computer all the elements of the page appear in different locations.

 
Replies
  • Currently Being Moderated
    Jul 29, 2012 10:21 AM   in reply to snowgater

    I am afraid you fell into the trap of attempting to structure your site with absolute DIV's.

     

    Read this to learn why this won't work

    http://www.apptools.com/examples/pagelayout101.php

     

    If you wish to dip your toes into the cutting edge of grid and responsive designs, see this:

    http://www.responsivegridsystem.com/

     

    Hopefully, others will post suggestions for less ambitious designs.

     
    |
    Mark as:
  • Currently Being Moderated
    Jul 29, 2012 10:24 AM   in reply to snowgater

    Start over with a pre-built CSS layout that does not rely on positioning (view source to see the code)

    http://alt-web.com/TEST/LHS-test.html

     

    Default CSS positioning (none/static) is all you really need for 98% of layouts.  Alignment of elements is achieved with CSS margins, padding and floats.

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Jul 30, 2012 6:45 AM   in reply to snowgater

    Just so you'll know, resolution has no effect on the rendering of a webpage.  A given webpage will look identical on ANY resolution screen, provided you look at it in a browser viewport that has the same width.  This suggests (correctly) that the limiting variable is not resolution, but browser viewport width.  If you want your page to adapt, then use the browser viewport width to determine how it should adapt, not the resolution.  And by the way, I completely agree with Nancy's suggestion and Ken's analysis.

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points