Andrew Gaffney wrote: > It appears both the one that matches what I want from the first set and the > 2nd > link use float and negative margins, which is already what I'm using for > layout > of the 3 columns inside of "CenterBox". > > The problem I'm having is that if I make "CenterBox" use anything other than > position:absolute, that 3 column layout no longer stays *within* the > "CenterBox" > DIV (it becomes zero height). There are a few ways to make a 3 col layout (in order of personal pref):
1. Using floats 2. Using absolute positioning 3. Using display: table 4. Using <table> Ok... let's examine the options from the bottom up. Option #4... do I even need to say why not to use this one unless unavoidable? Thought not. Option #3 is pretty decent, it makes the row display exactly as the designer would like, including making the height of each section equal! However, the good folks over at Mickeysoft can't read a specification to save their lives and have still not implemented display: table (even in IE7, talk about out of date!), so good luck with that option. Option #2 is a solid option but I try and avoid positioning things absolutely unless I *ahem* absolutely must (pardon the pun). But, you've specified that you don't wish to use position: absolute so this isn't really an option for you. Option #1 is my preferred method but if you're doing a 3 col section within a 3 col layout that's already using floats clearing an element can have unexpected results. The good news for you? By changing your position to relative, you've just told your box to not contain elements with position: absolute / float applied (such as your 3 columns). This means that if you insert a clearing div (<div style="clear: left"></div>) after your 3 columns your box will expand to once again contain the columns. However, now that you've told the page to reserve space for that element, to re-position it where it belongs you need to add "top: 123px; left: 96px;" and remove your margin settings. This should make the page look exactly the same as it does with position: absolute. No idea if that's what you want or not, but there you have it. Oh, and the link to your stylesheet didn't work because your server is case-sensitive so you forgot to capitalize the 's' in 'sheet.' ;) -- Thanks, Jim ______________________________________________________________________ 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/
