Re: [css-d] Multiple float 'columns' and gutters
--- On Sun, 6/22/08, Barrett <[EMAIL PROTECTED]> wrote: > Why not use a CMS or at least a server side include that > editors could update without messing with the structure ? Hi Barrett, While that is certainly one possible solution: a) We're already using a (not very good) CMS, and I don't think it will allow me to specify class names according to odd/even order. To clarify, I *want* to allow people to swap the order of boxes, and I *would like* it if they didn't have to manually edit a class name when they do that. b) Regardless of back-end process, I still think this is a valid requirement: i.e. to display a series of boxes in a column layout which can be reordered with minimum effort, with nice clean markup. Regards, - Bobby __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Multiple float 'columns' and gutters
Why not use a CMS or at least a server side include that editors could update without messing with the structure ? Here is a good CMS http://www.emediasales.com/hosting/php-mysql-cms-design.html http://www.emediacms.com/ While I've not personally used it or needed one; I know the people behind it. Thanks, Barrett AOL/AIM handmadepaperus On Jun 20, 2008, at 9:15 AM, Bobby Jack wrote: > Hi all, > > I'm working with a design that aligns several (well, 2, 3, or 4) > 'panels' in a 2 'column' grid, a bit like: > > [1] [2] > [3] [4] > > These are contained in a fixed-width box, and the mechanism > currently used is to float 1 & 3 to the left, float 2 & 4 to the > right, assign fixed widths, and leave the remaining width as the > gutter. While this works, if anyone updates the panels by swapping > their order, and forgets to reassign the class names, everything > breaks down. > > The challenge is to 'bulletproof' this design, whilst keeping all > widths at their current values. > > My immediate thought to fix this was to float the 4 panels to the > left, assign left and right margins (half the gutter width) to > them, and introduce an intermediate wrapper between the existing > fixed-width box and the panels, then set negative left/right > margins on this new wrapper. Works like a treat in Firefox, falls > down horribly in IE. > > Anyone have any better solutions? I want to avoid CSS hacks to > 'fix' IE, if at all possible (but can ignore IE5). 'Real' examples at: > > http://www.fiveminuteargument.com/single-gutter-multiple-floats > > Cheers, > > - Bobby > __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Multiple float 'columns' and gutters
On Fri, Jun 20, 2008 at 3:15 PM, Bobby Jack wrote: > Hi all, > > I'm working with a design that aligns several (well, 2, 3, or 4) 'panels' in > a 2 'column' grid, a bit like: > > [1] [2] > [3] [4] > [...] > > My immediate thought to fix this was to float the 4 panels to the left, > assign left and right margins (half the gutter width) to them, and introduce > an intermediate wrapper between the existing fixed-width box and the panels, > then set negative left/right margins on this new wrapper. Works like a treat > in Firefox, falls down horribly in IE. > > Anyone have any better solutions? I want to avoid CSS hacks to 'fix' IE, if > at all possible (but can ignore IE5). 'Real' examples at: > > http://www.fiveminuteargument.com/single-gutter-multiple-floats Don't know if the following falls in the "CSS hacks" category that you want to avoid, anyway you can make your method work in IE giving hasLayout to your intermediate wrapper (try for example giving it width:240px) This seems sufficient for IE7. For IE6 and lower you have to add display:inline to your floats to fix the margin doubling (and this is a harmless fix even if sent to all browsers.) Bruno -- Bruno Fassino http://www.brunildo.org/test __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Multiple float 'columns' and gutters
Hi all, I'm working with a design that aligns several (well, 2, 3, or 4) 'panels' in a 2 'column' grid, a bit like: [1] [2] [3] [4] These are contained in a fixed-width box, and the mechanism currently used is to float 1 & 3 to the left, float 2 & 4 to the right, assign fixed widths, and leave the remaining width as the gutter. While this works, if anyone updates the panels by swapping their order, and forgets to reassign the class names, everything breaks down. The challenge is to 'bulletproof' this design, whilst keeping all widths at their current values. My immediate thought to fix this was to float the 4 panels to the left, assign left and right margins (half the gutter width) to them, and introduce an intermediate wrapper between the existing fixed-width box and the panels, then set negative left/right margins on this new wrapper. Works like a treat in Firefox, falls down horribly in IE. Anyone have any better solutions? I want to avoid CSS hacks to 'fix' IE, if at all possible (but can ignore IE5). 'Real' examples at: http://www.fiveminuteargument.com/single-gutter-multiple-floats Cheers, - Bobby __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/