Results 1 to 7 of 7
  1. #1
    Join Date
    Oct 2003
    Posts
    917

    Ensure website compatibility in all resolutions

    Hello,

    Recently I came across some information either about CSS or something which ensures that your website is compatible in all screen resolutions so that there isn't any distortion or the layout doesn't break.

    Anyone know what I'm talking about? If you can shed some light on this it would be much appreciated.

    Cheers
    Daryl

  2. #2
    Join Date
    Aug 2008
    Location
    Cyprus, EU
    Posts
    50
    You should use the so called fluid or Elastic layout, in short instead of using fixed width, e.g #wraper{width:960px} //Fixed
    you either dont define width or use %
    #wraper{width:90%} //Fluid
    or elastic in which case you define your width in em, and will change width as the text is enlarged
    #wraper{width:40em} //Elastic

    All methods have their cons/pros and there is a lot of argument which is correct.

    I personally think that it all depends from your design, all designs require different layout, which might be fluid or fixed, so I would say there is no right or wrong layout.

  3. #3
    Join Date
    Oct 2003
    Posts
    917
    Thanks for your input WebNaz, much appreciated. Is this the only way to go about it? Or are there alternatives?

    Cheers
    Daryl

  4. #4
    Join Date
    Aug 2008
    Location
    Cyprus, EU
    Posts
    50
    Another method is getting the visitors screen resolution/OS/Browser version, e.g with javascript and displaying the appropriate template/css

    Again this has its cons/pros

    In short, there is no 100% solution, you have to take many variables into consideration (design, target audience, content etc) and decide which is best for you.

  5. #5
    Join Date
    May 2007
    Location
    Pune, India
    Posts
    42
    or if your design demands fixed widths then just design the layout according to the most popular resolution used.. like in a survey it was noted that 800x600 is a resolution that is long gone.. so optimize your website for 1024x768 and it will look right in all the resolutions bigger than that..
    Siddharth Dubey
    Web Designer/HTML-CSS Coder
    Personal Website | dA Portfolio

  6. #6
    Join Date
    Aug 2005
    Location
    Barcelona, Spain
    Posts
    3,371
    Fluid 960.gs is a great start

    designinfluences.com/fluid960gs/12/

  7. #7
    Join Date
    Oct 2003
    Posts
    917
    Thanks guys for your feedback which has certainly been helpful.

    Cheers
    Daryl

Posting Permissions

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