58 lines
1.2 KiB
HTML
58 lines
1.2 KiB
HTML
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
|
||
|
|
<html>
|
||
|
|
<head>
|
||
|
|
<title>Css Positioning Example - Div Tag Layout Position Absolute</title>
|
||
|
|
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
|
||
|
|
<style type='text/css'>
|
||
|
|
/* CSS Document */
|
||
|
|
|
||
|
|
div, h1, p {
|
||
|
|
font-family:arial, tahoma, sans-serif;
|
||
|
|
border:1px solid red;
|
||
|
|
margin:4px;
|
||
|
|
background-color:pink;}
|
||
|
|
|
||
|
|
div {width:400px; height:200px;}
|
||
|
|
|
||
|
|
p {width:300px;}
|
||
|
|
|
||
|
|
div#page1 {
|
||
|
|
position:absolute;
|
||
|
|
top:25px;
|
||
|
|
left:25px;}
|
||
|
|
|
||
|
|
div#page2 {
|
||
|
|
position:absolute;
|
||
|
|
top:25px;
|
||
|
|
left:360px;}
|
||
|
|
|
||
|
|
p.para1 {
|
||
|
|
position:absolute;
|
||
|
|
top:60px;
|
||
|
|
left:40px;}
|
||
|
|
|
||
|
|
p.para2 {
|
||
|
|
position:absolute;
|
||
|
|
top:120px;
|
||
|
|
left:60px;}
|
||
|
|
</style>
|
||
|
|
|
||
|
|
|
||
|
|
</head>
|
||
|
|
|
||
|
|
<body>
|
||
|
|
|
||
|
|
<div id="page1">
|
||
|
|
<h1>Love Sayings</h1>
|
||
|
|
<p class="para1">You love simply because you cannot help it. Kim Anderson</p>
|
||
|
|
<p class="para2">You love simply because you cannot help it. Kim Anderson</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div id="page2">
|
||
|
|
<h1>Love Love Love</h1>
|
||
|
|
<p class="para1">You love simply because you cannot help it. Kim Anderson</p>
|
||
|
|
<p class="para2">You love simply because you cannot help it. Kim Anderson</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</body>
|
||
|
|
</html>
|