Layout with position:absolute;
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>CSS Positioning Example</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, verdana, sans-serif;
border:1px solid #000000;
margin:5px;
background-color:#ffffff;}
div {width:300px; height:120px;}
p {width:250px;}
div#page1 {
position:absolute;
top:20px;
left:20px;}
div#page2 {
position:absolute;
top:20px;
left:350px;}
p.para1 {
position:absolute;
top:50px;
left:20px;}
p.para2 {
position:absolute;
top:80px;
left:20px;}
</style>
</head>
<body>
<div id="page1">
<h1>Heading One</h1>
<p class="para1">This is paragraph one.</p>
<p class="para2">This is paragraph two.</p>
</div>
<div id="page2">
<h1>Heading One</h1>
<p class="para1">This is paragraph one.</p>
<p class="para2">This is paragraph two.</p>
</div>
</body>
</html>
Related examples in the same category