How to make DIVs works with any Screen Resolution

Discussion in 'CSS' started by clobberx, Jun 13, 2008.

0
  1. #1
    can you guide me how to make a webpage using DIVs work in any screen resolutions screens

    the page should perfectly fit to any sizes
    800x640
    1024x768
    1280x800
     
    clobberx, Jun 13, 2008 IP
  2. jBud

    jBud Peon

    Messages:
    387
    Likes Received:
    8
    Best Answers:
    0
    Trophy Points:
    0
    #2
    1) make it to the lowest resolution... higher res. will see a lot more blank screen space
    2) make it fluid (precentage, ems based)
    3) make 3 diffrent layouts (css files) and use a screen res detection script to load the appropriate file
     
    jBud, Jun 14, 2008 IP
  3. clobberx

    clobberx Active Member

    Messages:
    73
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    61
    #3
    can u please explain me the 2nd
     
    clobberx, Jun 14, 2008 IP
  4. motex

    motex Peon

    Messages:
    234
    Likes Received:
    5
    Best Answers:
    0
    Trophy Points:
    0
    #4
    A fluid design will accomodate a range of screen resolutions. It wont be perfect, but it IS better then an 800x600 user looking at a site optimized only for 1280x800.

    Using percentages, you can strecth areas instead of making them a static number all the time like. 30px. Instead with fluid you would do something like 10%. In this way your site will use 10% of the webspace for any resolution size.

    Say you have a banner.
    Its 100px wide, it has a main logo at the top, and a complex fade in the background.
    With a liquid design, instead of making a div for 100px....then high end users get screwed...you code it with percentages, so the rest of the space still gets used even with a repeating fade background and STILL centering the main logo correctly.

    Make sense?

    Hopefully this explains a bit.
     
    motex, Jun 14, 2008 IP