Ben Rogers wrote:
>>Well, your problems are manyfold.
>>
>>Firstly, you're depending on behaviour that was never mandated in the
>>specs, that being that a height of 100% means 100% of the available
>>window area or available area.
>
> I don't think he's "depending" on this behavior. He's lamenting the fact
> that CSS doesn't support a mechanism for sizing elements relative to the
> available space. In HTML all heights and widths are based on the
available
> area, not the size of the containing block.
What I meant by depending is that while such behaviour isn't specified
in the spec, it is available in a fair few browsers in their quirks
mode, but not in their standards mode.
And thanks for the article below: I didn't know about the 100% height on
the html element trick.
> I also think he's hoping that someone will prove him wrong. :)
Well, I was trying to show that he was trying to put in a screw with a
hammer rather than a screwdriver: it might kinda work, but it's not the
right way, seeing as his problem was really a positioning one rather
than
>>If IE wasn't so braindead, it'd support fixed positioning. In this case,
>>you could position your elements wherever you liked relative to the four
>>sides of the screen. This is possible in Firefox, but not in IE, because
>>MS have slowly let IE die.
>
> Fixed positioning is possible in Internet Explorer. It is even possible in
> versions of Internet Explorer which pre-date the Mozilla project. Again,
> this is not about positioning, it's about sizing elements.
But what he's trying to do *is* positioning, not sizing. I know he's
talking about sizing, but what I'm trying to get across is that *his*
particular problem isn't with sizing, and not with the differences
between the MS and W3C box models.
And IE doesn't support fixed positioning, nor has it ever done so. Try
the code below in IE6, Firefox, Opera, and any other browsers you can
lay your hands on if you don't believe me.
> Also, Microsoft has not let Internet Explorer die. They are going to tie
> Internet Explorer upgrades to new releases of the operating system.
> Personally, I wish they hadn't made this decision, but that's their
> currently announced intention.
And there only doing that because another strong contender appeared on
the scene in their primary market. They *had* let it die, but now
they're resurrecting it.
> However, none of the solutions mentioned in these articles completely solves
> Isaac's problem. In fact, Isaac only got as far as he did because he mixed
> html table tags with divs.
And my argument is that he's attacking the problem with the wrong tools.
Positioning is what he want. It's a pity IE just doesn't support it
completely enough.
Mind you, there's a set of JavaScript hacks called IE7, which you've
probably heard of, that fixes a lot of these flaws in IE6.
> However, I was unable to eliminate the vertical scroll bar. I'm not even
> quite sure where this is coming from. My guess is it's the window chrome.
Yup, it's part of the chrome. That, and the padding at the bottom of the
outermost div is going to trigger it anyway.
Here's that code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";>
<html lang="en-ie" xml:lang="en-ie"><head>
<title>Untitled</title>
<style type="text/css" media="screen">
#fixed-thingy
{
position: fixed;
right: 60px;
top: 80px;
bottom: 60px;
border: 1px solid black;
background: white;
padding: 1ex;
}
</style>
</head><body>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<p>Padding!</p>
<div id="fixed-thingy">I’m here because of fixed positioning!</div>
</body></html>
Using fixed positioning, his problem can be solved as follows:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";>
<html xml:lang="en-ie" lang="en-ie"><head>
<title></title>
<style media="screen" type="text/css">
body
{
margin: 0;
padding: 0;
}
form
{
margin: 0;
}
#doc_type, #doc_ladder, #nav_frame_menu, #nav_frame_content, #doc_bottom
{
position: fixed;
}
#doc_title
{
left: 3px;
right: 3px;
top: 3px;
height: 40px;
}
#doc_ladder
{
left: 3px;
right: 3px;
top: 46px;
height: 20px;
}
#nav_frame_menu
{
left: 3px;
top: 69px;
bottom: 166px;
width: 250px;
}
#nav_frame_content
{
left: 259px;
top: 69px;
bottom: 166px;
right: 3px;
}
#doc_bottom
{
left: 3px;
right: 3px;
bottom: 100px;
height: 60px;
}
</style>
</head><body>
<div id="doc_title">onTap Framework</div>
<div id="doc_ladder">Home</div>
<iframe name="nav_frame_menu" id="nav_frame_menu" frameborder="1"></iframe>
<iframe name="nav_frame_content" id="nav_frame_content"
frameborder="1"></iframe>
<div id="doc_bottom">
<form action="https://www.paypal.com/cgi-bin/webscr"; method="post">
<input type="hidden" name="cmd" value="_xclick" />
<input type="hidden" name="business" value="[EMAIL PROTECTED]" />
<input type="hidden" name="item_name" value="onTap Framework" />
<input type="hidden" name="item_number" value="ontapframework" />
<input type="hidden" name="no_note" value="1" />
<input type="hidden" name="currency_code" value="USD" />
<input type="hidden" name="tax" value="0" />
<input name="submit" type="image" border="0" alt="Make a donation."
style="border:0;background-color:transparent;float:left"
src="http://mx/otp/test/_components/docs/_images/donations.gif"; />
</form>
<a href="http://affiliates.macromedia.com/b.asp?id=2549&p=go/dr_home_aff1";
target="_blank"><img align="right" border="0" style="float: right"
src="http://affiliates.macromedia.com/showb.asp?id=2549&img=mx2004_468x60_b.gif";
/></a>
</div>
</body></html>
Hence, my point.
--
Keith Gaughan, Developer
Digital Crew Ltd., Pembroke House, Pembroke Street, Cork, Ireland
http://digital-crew.com/
--
No virus found in this outgoing message.
Checked by AVG Anti-Virus.
Version: 7.0.296 / Virus Database: 265.6.2 - Release Date: 20/12/2004
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Special thanks to the CF Community Suite Silver Sponsor - CFDynamics
http://www.cfdynamics.com
Message: http://www.houseoffusion.com/lists.cfm/link=i:4:188388
Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4
Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
Donations & Support: http://www.houseoffusion.com/tiny.cfm/54
![http://mx/otp/test/_components/docs/_images/donations.gif"](http://mx/otp/test/_components/docs/_images/donations.gif"){kind=link}
![http://affiliates.macromedia.com/showb.asp?id=2549&img=mx2004_468x60_b.gif"](http://affiliates.macromedia.com/showb.asp?id=2549&img=mx2004_468x60_b.gif"){kind=link}