Flii wrote: > I have been given the task of creating a generic web site for our > customers, and have been researching and experimenting with many of > the layouts listed in the wiki and elsewhere on the web. The biggest > problem I face is that one layout example using 3 columns will not > need the same html markup as a layout with 2 and still have the > number of sections I have. > > For example, the negative margin 3 column examples put an extra <div> > around two columns. Another example puts an extra <div> around all 3 > columns. The problem then occurs when the "menu" div (which would > now be permanently stuck with the content div) needs to be on the > same line as the header. This is a bit confusing, so I'll try to > explain with pictures. > > Layouts that I would like to support (forgive the geocities link - I > have no domain name to upload to and had to find something free): > <http://www.geocities.com/gotcj/layouts.html> > > TJK design has a wonderful picture showing how to do the 3 column > layout they have (notice the extra div around left/main): > <http://www.tjkdesign.com/articles/3cols.asp> > > > My question to this list is: Is it possible to have one html file, > and style these pages this way with only CSS? If so, are there > examples or advice? Preferably I'd like the option for the footer to > stay at the bottom of the viewport or content (whichever is longer) > because I'm sure some will want to. Styles 1-3 are manageable for > me, but then trying to get the same html to work in 4 and 5 are where > I lose all my hair. :(
If you go for fluid layouts with all widths in "%" I think you could make it work with the elements flowing the way you have them. As a side note, I would not go with a solution that relies on "position:absolute" (as Christian suggested). Thierry | www.TJKDesign.com ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
