<!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=UTF-8" />
<title>absoluteBox</title>
<style type="text/css">
<!--
.bigBox
{
background-color: #FFFF99;
height: 600px;
width: 600px;
left: 50px;
top: 50px;
position: absolute;
}
.middleBox
{
background-color: #FF9933;
height: 400px;
width: 400px;
position: absolute;
top: 100px;
left: 100px;
}
.smBox
{
background-color: #CC0000;
height: 50px;
width: 50px;
top: 160px;
position: absolute;
left: 160px;
}
.bigBox2
{
background-color: #FF3333;
height: 600px;
width: 600px;
position: fixed;
margin-left: 1000px;
margin-top: 50px;
}
.middleBox2
{
position: fixed;
height: 400px;
width: 400px;
background-color: #FFFF66;
left: 1100px;
top: 150px;
}
.smBox2
{
position: fixed;
height: 50px;
width: 50px;
background-color: #FF9900;
top: 300px;
left: 1250px;
}
-->
</style>
</head>
<body>
<div class="bigBox2"></div>
<div class="middleBox2"></div>
<div class="smBox2"></div>
<!--need to select from code and move to inside big box div class to be in the box-->
<div class="bigBox">
<div class="middleBox">
<div class="smBox"></div>
</div>
</div>
</body>
</html>
got it thanks
ReplyDelete