fss and css layout question

[Michael S Elledge]

You may also want to use percentages rather than pixels to keep your 
layout liquid...

Mike

Jacob Farber wrote:
> If your looking for 7 containers, then I would use the technique you 
> mentioned in #2, and overwrite the width to 135px instead of keeping 
> the 150/100 px width.
> Jacob
>
> On Tue, Feb 17, 2009 at 10:39 AM, Laurel A. Williams 
> <laurel.williams at utoronto.ca <mailto:laurel.williams at utoronto.ca>> wrote:
>
>     Hi Jacob,
>
>     Actually, the original examples (sent Friday) both did have 7 columns.
>
>     What I really wanted was 7 columns of approximately equal widths
>     in a 950px wide container.
>
>     Since the flex columns only go up to 5 in the fss, I tried a
>     grouping of 4 columns and a grouping of 3 columns - as per your
>     suggestion. You can see an example of this at:
>     http://fluidproject.org/dev/index.php/partners in the Fluid
>     Academic partner institutions section.
>
>     I used the second style on:
>     http://fluidproject.org/dev/index.php/collaborate to position the
>     images and text at the bottom of the page. I used 100 and 150
>     width containers alternately because 100 was way too small (700
>     total width ended up too narrow) and 150 was too big (total would
>     have been 1050px - larger than 950px container).
>
>     So - would the more simple technique be to write my own fss
>     classes for 7 columns?
>
>     Laurel
>
>     Jacob Farber wrote:
>
>         The most critical mechanism in the fss files for laying
>         something out is just to use one of the many "fl-container..."
>         or "fl-col..." class names, so that we can easily linearize
>         it. It's not as critical how you use them, just that you do.
>         That being said.....
>
>         Occam's razor is king when it comes to laying out css +
>         markup. It is very important to map out the simplest solution
>         to avoid big cross-browser headaches, bloat, css errors, and
>         performance.
>
>         Truth is, the example above looks incomplete and the two
>         techniques do different things (#1 is 7 containers, #2 is 5
>         containers.). If your looking for the difference between
>         columns and containers, then the answer lies in what your
>         laying out and how it should behave. Columns are great for
>         flexible consistent width containers. Containers are more
>         general purpose. Many times, the two are interchangeable.
>
>         In this example, if you just want to lay things out side by
>         side of alternating widths, then you have to go with technique
>         #2 since columns are even and this doesn't look like that's
>         what you want.
>         Sometimes it's good to have a strong idea of how the grid for
>         a site should behave: This article on grids might help
>         <http://www.markboulton.co.uk/articles/detail/five_simple_steps_to_designing_grid_systems/>
>
>         I hope that sheds some light!
>         Jacob
>
>
>
>
>         -- 
>         Jacob Farber
>         University of Toronto - ATRC
>         Tel: (416) 946-3002
>         www.fluidproject.org <http://www.fluidproject.org>
>         <http://www.fluidproject.org>
>
>
>     -- 
>     Laurel A. Williams
>
>     Adaptive Technology Resource Centre
>     University of Toronto
>
>
>
>
> -- 
> Jacob Farber
> University of Toronto - ATRC
> Tel: (416) 946-3002
> www.fluidproject.org <http://www.fluidproject.org>
> ------------------------------------------------------------------------
>
> _______________________________________________________
> fluid-work mailing list - fluid-work at fluidproject.org
> To unsubscribe, change settings or access archives,
> see http://fluidproject.org/mailman/listinfo/fluid-work
>