At 2/8/2007 03:25 PM, Seona Bellamy wrote: >Creating a sitemap for a client and what they want is for the list to be as >follows: > >01. Section 1 > - Sub-page > - Sub-page >02. Section 2 > - Sub-page > - Sub-page > - Sub-page > - Sub-page >03. Section 3 > - Sub-page > - Sub-page >etc... > >However, they also want ti split over two columns so that it doesn't end up >just scrolling forever. Fair enough. However, since this is to plug into >their CMS, I need to allow for a variable number of sections and sub-pages. > >I've had a search around, but so far all the examples I'm finding require >knowing how many items are in each column or the height of each column. I >have no way of knowing either. > >Is there a way of doing this that will allow the columns to stay more or >less equal regrdless of how many items there are?
Hi Seona, You probably do need scripting to accomlish this today. Although you can't predict the number of list items, a script can count them on the fly and shape the list accordingly. Although my first choice would be server-side scripting, you can also do it with Javascript if you don't mind the layout breaking when scripting is disabled. I would limit the script to plugging in ids or classes and let CSS handle the positioning. One method I like is to move the first item you want in column 2 up with a negative margin-top, and shift all items in column 2 over with positive margin-lefts. This lets the list flow normally as much as possible and avoids browser-related bugs that affect other CSS-based methods. See example 6 in my ALA article on the subject: http://www.alistapart.com/articles/multicolumnlists/ In these examples I show the list heavily marked up with class names. Of course these can be inserted on the fly and needn't be a part of your original markup. In your scripting logic I imagine you'll want to decide how to handle widows & orphans so you don't strand a section title at the bottom of column1 or the last item of a section at the top of column 2. Regards, Paul __________________________ Paul Novitski Juniper Webcraft Ltd. http://juniperwebcraft.com ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
