Posted by dorayme on 01/05/07 22:00

In article
<1168025029.763651.179500@42g2000cwt.googlegroups.com>,
"rob@codebox" <spamgood@gmail.com> wrote:

> Hi,
> I really hope someone can help me with this - I have a screen layout
> that I need to get working, it's oh so easy in Firefox but just falls
> to pieces in IE. 3 boxes: a fixed size menu-style one on the left, a
> fixed height, variable width one on the bottom, and a large dynamic box
> filling the rest of the screen. Here's a bare-bones version of the
> HTML:
>

In case you are not aware of this, IE6 expands boxes to fit the
content unlike the more compliant browsers. At least put in some
content in IE to see the boxes. This design is rather brittle as
a template, the left very narrow for content and will look worse
in non-IE <7 (at least) browsers where stuff ("correctly")
overflows the boxes. I would not recommend this absolute
positioning schema.

Try putting in % margins (leftBar can stay as 2px for Left I
guess) and widths for your boxes for perhaps behaviour that might
suit you better if you insist on the schema. At least for IE (via
star hack or conditional)

#leftBar{
left: 2px;
top: 2px;
width: 10%;
height: 300px;
}
#mainArea{
left: 11%;
top: 2px;
right: 2px;
bottom: 56px;
width: 89%;
}
#bottomBar{
bottom: 12px;
height: 50px;
left: 11%;
right: 12px;
width: 89%;
}

--
dorayme

[Back to original message]