1 Reply Latest reply on Apr 23, 2012 10:37 PM by martcol

    Resolution/Compatibility/liquid layout


      Im a highschool student trying to learn how to make my website accomodate those of who are viewing it on smalle monitors as well lacrosse-lounge.com if you could paste like a code for the liquid layout version of my site id be most gracious cause im have much much trouble trying to figure out how to do it. I've heard of change all your table widths to 100% but it seems as though the site isnt working or looking right when i try it. If there's anyone out there that has the snippets of code that i need to change and what i need to change it to id really appreciate it help the youth and future out. This is only my second website and I need my client to be happy please help me. Thank you is there javscript that would be easyer to use.

        • 1. Re: Resolution/Compatibility/liquid layout
          martcol Level 4

          Building sites that work accross a wide range of screens/devices is referred to these days, as "responsive design" and the technique partly, relies on using @media queries. The stumbling block at the moment, is what to do about images.  Making images responsive is not so straightforward.  This will give you an idea: http://forums.adobe.com/message/4349178#4349178 but it is also a talking-point on the web so if you Google that, you will get plenty more!


          Liquid layouts are also not the easiest things to implement.  Nancy O has a template you could look at here: http://alt-web.com/TEMPLATES/3-col-liq-layout.shtml and if you Google it, you will find plenty of other resources.


          I do think that your reliance on images and tables for structure and content is going to cause you some difficulty.  These are not flexible design elements whereas, divs with percent or em base dimensions, where content determines the height of an element are.