Wonderbaby Designs wrote: > http://www.wonderbabydesigns.com/testing/design.jpg
Nice design, that shouldn't be too difficult to lay out and style with CSS. > http://www.wonderbabydesigns.com/testing/cssTest.htm Not well suited for styling yet. > - we want the page to have a minimum width of 750px and a max width > of 1100px. I would start from scratch with an 'all-float' like... <http://www.alistapart.com/articles/negativemargins/> Even if you don't use that ALA-example, the article is still useful as it explains how to solve many of the line-up problems you have or will meet. Some more examples of 3-column layouts here... <http://css-discuss.incutio.com/?page=ThreeColumnLayouts> --- The addition of... #container {margin: 0 auto;} ...will center the page horizontally and keep it within the min/max values. Set the margins on body to zero. Use /shorthand/ like 'margin: 0;', not 'margin: 0 0 0 0;'. See... <http://www.456bereastreet.com/archive/200502/efficient_css_with_shorthand_properties/> ...for more on the subject. --- Delete the 'width:expression' you have now. That one is created for older 'quirks mode' versions of IE/win, and will make IE6 freeze since you'll be triggering 'standard mode'. The 'dual mode' 'pixel-based min/max-width expression' on this page... <http://www.gunlaug.no/contents/wd_additions_14.html> ...will work as intended when given the correct values for your design. > - the copyright info needs to lock at the bottom of the left column > and the photobox needs to lock at the bottom of the right column. Column-heights are often problematic. See below. > - we want the 3 main content columns to match up at the bottom. There > is enough content on almost every page of our site to have the page > fully extended but I think I would also like to have some sort of > minimum height, if possible. Columns don't really extend further down than their content pushes them. We usually fake 'equal height' columns one way or another, which means there isn't a real column-bottom except for the tallest column - the one with most content. We can create real 'equal height' columns with 'CSS table' - simulating HTML table, but no IE version supports those CSS properties. These restrictions make it a bit of a problem to lock elements to the bottom of a visual column. Depending on what it is that needs to be locked to the column-bottoms, we tend to get the best line-up by positioning it upwards from below the entire column-structure - often from within a footer-element. I think that may work quite well for your design, without messing up the logical content-sequence. > - I am still using a table for the header, because I just couldn't > figure out how to get the placement of all those elements correct. A combination of floating and absolute positioning images and text-elements inside a header-div should work fine for what you've got there. You have to decide what should happen if/when some visitor apply a bit of font-resizing though. > I don't think these are insurmountable problems, but I do think that > they might be more complex than I can manage. We'd like to be as > cross-browser compatible as possible, so hacks or fixes for known > browser problems would be appreciated. Some fixes for IE/win will be needed, but other than that it should not be a problem. Just make sure you style for non-IE browsers first, and fix IE later. It'll be easier that way. Something like the following order will do... <http://www.stuffandnonsense.co.uk/archives/css_browser_testing_order.html> > If there are too many issues here to tackle in one message, please > let me know, and I can break it down. No problem, AFAICS. I've been pretty non-specific this time around, since there's not much use in delivering a finished page to you at this stage. Doing so might have taken less time than to write this response, but you need to take it step by step or else there's a great risk that you'll lose track of how CSS works (and how it doesn't). Start by open your site to Lynxview... <http://www.delorie.com/web/lynxview.html> ...and make it work well on that basic (HTML) level (yes, I'm serious :-) ) - making most of semantic use of HTML elements. From there you just need a bit of time to learn how to control a '3-column layout with header' with CSS. You'll get plenty of additional input here on css-d on how to solve positioning-problems, once the basics are in place. regards Georg -- http://www.gunlaug.no ______________________________________________________________________ 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/
