|
Posted by sunil on 11/24/64 11:47
It is absolutely nothing.. It will resize while the div tag resizes.
All div tags are defined in % values..And it is not background image.
See the below code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"
/>
<title>background image resize - CSS only</title>
<meta name="" content="authored by http://www.nopeople.com" />
<style type="text/css">
body {
height: 100%;
width: 100%;
border: 0px;
margin: 0px;
padding: 0px;
}
html {
height: 100%;
width: 100%;
overflow: hidden;
}
#background_image {
position: absolute;
top: 0px;
left: 0px;
height: 100%;
width: 100%;
z-index: 1;
}
#page {
position: absolute;
top: 0px;
left: 2px;
z-index: 2;
height: 100%;
width: 100%;
overflow: auto;
}
#ad {
margin-top: 3%;
width: 30%;
float: right;
clear: right;
}
p {
text-align: right;
}
p.footer_link {
text-align: left;
margin: 0px;
}
#content {
width: 30%;
margin: 3%;
}
</style>
</head>
<body>
<img src="CRW_1603 Old Matanuska Bridge.jpg" alt="big pic" width="3364"
height="2548" id="background_image" />
<div id="page">
<div id="ad"><p class="footer_link">Web design by: <a
href="http://www.nopeople.com"
target="_blank">nopeople.com</a></p></div>
<div id="content"><p>Resize the window, and the background image will
scale to fit the new window size.</p></div>
</div>
</body>
</html>
Navigation:
[Reply to this message]
|