[Web4lib] basic explanations of css layout

[Will Kurt]

Don't forget ems which are based on the size of the character text 
box, so they have some of the best features of both px and %, they 
scale but still give you some tighter control of space and proportions.

And while I can't recommend a book (w3schools ftw- 
http://www.w3schools.com/css/default.asp ), I can highly suggest that 
you install the Firefox webdevolper extension: 
http://chrispederick.com/work/web-developer/  which is probably the 
best tool out there for any web-related work.

For learning it's very helpful as it allows you to edit the CSS on 
any site and see the changes made in real time (of course this only 
effects the version of the style sheet stored in your cache).  And as 
your skills advance you'll find it increasingly more useful (DOM 
inspector, plus the ability to change form POSTs to GETs is worth it alone).

Hope that helps,
Will



At 09:18 PM 9/10/2007, Clinton Lowery wrote:
>Ray,
>
>The difference between pixels and percentage equate to a fixed vs a 
>liquid layout.
>
>A window screen has a predetermined amount of pixels available to it 
>in the display area of a browser. For example, a 1028x768 display 
>for a Firefox browser usually nets you 1000-1010 pixels to play with 
>for a fixed layout.
>
>A percentage otoh, is the percentage of the viewable browser window, 
>not the display of the monitor.  For example, a 50% for a width 
>value will display the contained information inside an area 
>comprising 50% of the browser window, regardless of display size 
>(1024x768, 800x600, whatever) as well as the display size of the 
>window (e.g. if you resize your browser window, your 50% width will 
>move with the size of the window as it is resized).
>
>Percentages are encouraged for liquid layouts as even if the 
>majority of your users have 1024x768 displays, there may be many who 
>use 800x600 for whatever reason.  The % width will allow the screen 
>to resize itself for your users, instead of predetermining it for them.
>
>On the other hand, fixed widths are also encouraged for some 
>designers as you want the page to look how you want it to look, 
>regardless of window size.  Many will design for a 800x600 screen 
>that will be centered on a 1024x768 background.
>
>Hope this helps.
>
>Clinton Lowery, MLIS
>Jacksonville Public Library (Florida)
>
>"Raumin \"Ray\" Dehghan" <infoscience1 at gmail.com> wrote: Colleagues,
>
>does anybody have any recommendations of books and/or websites that 
>explain css
>layout in very simple, straightforward language?
>
>For example, i'm trying to understand why pixels seem to be easier to work
>with than percentages, etc.
>
>Thanks very much.
>
>-Raumin "Ray" Dehghan
>West Chicago Public Library
>West Chicago, Illinois
>_______________________________________________
>Web4lib mailing list
>Web4lib at webjunction.org
>http://lists.webjunction.org/web4lib/
>
>
>
>---------------------------------
>Don't let your dream ride pass you by.    Make it a reality with 
>Yahoo! Autos.
>_______________________________________________
>Web4lib mailing list
>Web4lib at webjunction.org
>http://lists.webjunction.org/web4lib/