Sent by Bruno Fassino on 20 June 2008 15:03
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-REMOVED]]
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/
