Michael Dayah

Michael,

> I'm interested in creating a box
> that's 15% from each edge (so 70% tall and wide)

this should be fairly simple to do.

* position the left edge of the box 15% from the left edge of the viewport + 
any scrolling offset to the left. Do the same with the top.

* make the width of the box 70% of the viewport width. Do the same with the
height

* reset right and bottom to auto

> It shouldn't need the tests if the
> page is going to be in standards-compliant mode, correct?

Unfortunately you will, since "standards-compliant mode" (yeah, right!) only
exists in IE 6+, not in IE 5.x. However, the fixed position fix also works
in IE 5.5, if you include the tests.

This is getting a bit complicated now though, so I will use a separate
script tag to keep things clean.

<style type="text/css"><!--
#fixme {
    position: absolute;
    left: 15%;
    top: 15%;
    bottom: 15%;
    right: 15%;
    background-color: blue;
}
body > div#fixme { position: fixed; }
--></style>
<!--[if gte IE 5.5]>
<![if lt IE 7]>
<script type="text/javascript">
function getIESze() {
    var de = document.documentElement;
    var db = document.documentElement;
    return [
        ( de.clientWidth ? de.clientWidth : db.clientWidth ),
        ( de.clientHeight ? de.clientHeight : db.clientHeight )
    ];
}
function getIEScrl() {
    var de = document.documentElement;
    var db = document.documentElement;
    return [
        ( de.scrollLeft ? de.scrollLeft : db.scrollLeft ),
        ( de.scrollTop ? de.scrollTop : db.scrollTop )
    ];
}
</script>
<style type="text/css">
div#fixme {
    left: expression( ( Math.round( getIESze()[0] * 0.15 ) + getIEScrl()[0] ) + 'px' );
    top: expression( ( Math.round( getIESze()[1] * 0.15 ) + getIEScrl()[1] ) + 'px' );
    width: expression( Math.round( getIESze()[0] * 0.7 ) + 'px' );
    height: expression( Math.round( getIESze()[1] * 0.7 ) + 'px' );
    right: auto;
    bottom: auto;
}
</style>
<![endif]>
<![endif]-->



Mark 'Tarquin' Wilton-Jones - author of http://www.howtocreate.co.uk/