Hello.
How can I make an absolutely-positions div element expand and fill the
remaining horizontal space available on-screen?
The background is that I've used CSS to create the normal 'three frames'
look using div elements rather than frames. One of these DIV elements needs
to contain an iframe, and that iframe must expand to use all space available
to it. I had been using "width=100%" in the iframe and this works fine in
Gecko and IE, but not in KHTML-based browsers (I'm specifically interested
in getting it working with Safari 1.0). With KHTML, the iframe doesn't show
at all and I've managed to isolate this to usingthe width tag in the iframe.
Take that away and things show, but not with the required width.
The URL for my problem is here:
http://www.eruvia.org/sarah/media/ph...ours/index.php
(or http://makeashorterlink.com/?J5F112915 to avoid linewrap)
The style for .IMAGEGALLERY, which is the style in use, is:
..IMAGE_GALLERY { background-color: #FFFFFF;
color: #000000;
font-family: Helvetica, Arial, sans-serif;
font-size: 12pt;
position: absolute;
top: 10%;
left: 151px;
height: 80%;
}
Adding a "width: 500px" to the above fixes the problem, but I'm looking to
use percentages rather than aribtrarily fixing a width. Adding something
like "width:80%' also masks the issue (and this is what I've temporarily
done), but expand the window far enough and you can still see it isn't
taking up the full width. Adding "width:100%" causes the whole thing to go
mad....
Thanks in advance for any information,
Ian
