position: fixed in IE - how?

[david graham]

http://www.turnip.clara.co.uk/jvaughan_cv_sysadmin.html

Hi
I think I should have posted this in c.i.w.a.s but this group are as strong
(if not stronger) than the more specialist group. Anyway, we all know that
IE (any version, at least for PC, don't know about IE5 Mac?) does not
implement position: fixed on anything other than background-attachment:
fixed, so how does this guys CV get round that problem. His CV works really
well in all browsers I have tested it in (NN7, Opera7.1, IE5). All I see in
the source is:

div.navbar {
position: fixed;
width: 25%;
height: 100%;
left: 0px;
top: 0px;
padding-left: 0px;

font-family: "Times New Roman", Times, Georgia, serif;

background: #f5f5f5;
}

no sign of any hack there!

BTW - I think it is worth studying how he has used CSS - I think it is a
high standard, is that a correct assessment?
I like the way he has seperated out CSS for compliant browsers from that
intended for older browsers.

thanks
David

 

[John W.]

http://www.turnip.clara.co.uk/jvaughan_cv_sysadmin.html

Hi
I think I should have posted this in c.i.w.a.s but this group are as strong
(if not stronger) than the more specialist group. Anyway, we all know that
IE (any version, at least for PC, don't know about IE5 Mac?) does not
implement position: fixed on anything other than background-attachment:
fixed, so how does this guys CV get round that problem. His CV works really
well in all browsers I have tested it in (NN7, Opera7.1, IE5). All I see in
the source is:

Try again, there is a whole lot more css than you show here.

[ snip little bit source ]



John OO
--

<http://webcel.nl/>
<http://www.webcel.nl/bayshop/shop/bayshop.html>

"Time is what prevents everything from happening at once"
- John Archibald Wheeler -

 

[david graham]

Try again, there is a whole lot more css than you show here.

OK - John, I have just read a reply - I think it was from you or Toby (lost
track of it now so I can't check) but I have copied the info for future
reference. This reply makes it clear that the approach adopted by the owner
of the CV is described in full at:

http://devnull.tagsoup.com/fixed/

The CSS that does the trick for IE5.x is enclosed in conditional comments,
the bit for IE5 is below

<!-- Stylesheet hacks to make page display correctly under IE5 -->
<!--[if IE 5]>
<style type="text/css">
/* Amends and adds rules needed by IE5.x to standards-compliant CSS */

@media screen {
body {
overflow: hidden;
z-index: 1;
}

div.navbar {
position: absolute;
z-index: 6;
overflow: hidden;
}

.spacer {
position: absolute;
margin-bottom: 0px;
width: 25%;
left: 0px;
bottom: 0px;
background: #F5F5F5;
height: 100%;
z-index: 5;
}

div.main {
margin-left: 0px;
position: absolute;
top: 0px;
left: 0px;
width: 100%;
padding-left: 30%;
z-index: 4;
height: 100%;
overflow-x: hidden;
overflow-y: scroll;
}

} /* End of @media screen */

</style>

<link href="http://www.unix-consultancy.com/css/cv/ie5hacks.css"
rel="stylesheet" type="text/css">
<![endif]-->

The link for ie5hacks.css goes to a stylesheet which is empty at the
moment - perhaps he is thinking of moving all the embedded css to an
external stylesheet at a future date

many thanks

David