In article
<11*********************@d57g2000hsg.googlegroups. com>,
"Sven C. Koehler" <sk******@gmail.comwrote:
Hello,
the html below displays a box (#container) with a #footer and
an #image inside. Is there any way how I could get rid of
declaring max-width and max-height for the #image?
The #image should fill up all the space left in the #container.
<html><head></head><body><style type="text/css">
#image { max-width: 200px; max-height: 90px; }
#container { position: fixed; width: 200px;
height: 100px; background-color: gray; }
#footer { position: absolute; bottom: 5px; }
</style>
<div id='container'>
<img id='image' src="http://www.google.com/intl/en_ALL/images/
logo.gif"/>
<div id='footer'>footer</div>
</div>
I'd be very thankful for any help with this issue.
Best,
Sven
Why are you putting the footer in the container? Or the style
below the head? If you want to get rid of the max-width, what is
stopping you? Nothing is stopping you from using width instead.
Is this what you want:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Cats in sinks</title>
<style type="text/css">
#image {width: 100%; height: 100%; }
#container { position: fixed; width: 200px;
height: 100px; background-color: gray; }
#footer { position: absolute; bottom: 5px; }
</style>
</head>
<body>
<div id="container">
<img id='image'
src="http://www.google.com/intl/en_all/images/logo.gif"
alt="google logo"></div>
<div id="footer">footer</div>
</body>
</html>
?
Oops... I forgot, John Hosking is dealing with the case of cats
in sinks.
--
dorayme