height attribute in CSS

[Gavin Wraith]

I have come across a difference between the way NetSurf 2.9 (on
an Iyonix) and Firefox 15 (on an XP notebook) treat the CSS
height attribute.
The way NetSurf does it gives the display I want, and I am trying
to figure out how to make Firefox do the same.

My webpages are to be in three columns, with the leftside and rightside
columns being narrow vertical graphics (that are links), with the content
in the middle column. 

The relevant CSS contains the following:

#leftside, #rightside
{
 position: absolute;
 top: 0;
 width: 70px;
 height: 100%;
 background-repeat: repeat-y;
 background-position: 0% 0%;
 text-decoration: none;
}
#leftside
{
 left: 0;
 background-image: url(images/background/lpage.png);
}
#rightside
{
 right: 0;
 background-image: url(images/background/rpage.png);
}
.content
{
 position: relative;
 width: auto;
 left: 70px;
 right: 70px;
 padding-right: 100px;
}

The trouble is that Firefox seems to be interpreting height: 100%;
as 100% of the height of the graphics screen, so as soon as you
scroll Firefox's window it becomes apparent that the lefthand and 
righthand columns are not extending to the bottom of the middle column.
Am I making an idiotic mistake somewhere and NetSurf is being more
forgiving than Firefox? Has anybody else encountered this?

-- 
Gavin Wraith (ga...@wra1th.plus.com)
Home page: http://www.wra1th.plus.com/

CSS height attribute

[Gavin Wraith]

I found out how to get the effect I wanted both in NetSurf
and in Firefox by avoiding the height attribute. I put
everything inside a containing box and for the left- and
right-hand columns set the attributes top and bottom to 0.
Then their heights get sucked to that of the middle column.

-- 
Gavin Wraith (ga...@wra1th.plus.com)
Home page: http://www.wra1th.plus.com/