Position layer : bottom « CSS « HTML / CSS

Position layer

  
<html>
<head>
<style type="text/css">
div.layer1 {
            position:absolute;
            left:75px;
            top:75px;
            color:red
}
div.layer2 {
            position:absolute;
            right:75px;
            bottom:75px;
            font-family: arial;
            color:blue;
            font-weight:bold
}
</style>
</head>
<body>
<div class="layer1">
<h1>Positioning Layers</h1>
<p>This is the first layer1 paragraph</p>
<p>This is the second layer1 paragraph</p>
</div>
<div class="layer2">
<p>This is the first layer2 paragraph</p>
<p>This is the second layer2 paragraph</p>
</div>
</body>
</html>

Related examples in the same category

1.	'bottom' Example
2.	Use bottom to offset the bottom of an element from the bottom.
3.	bottom aligns the bottom side of an absolute element to the bottom side of its container
4.	Bottom auto
5.	Absolute Outside Top Right with 100% bottom
6.	horizontally stretching content with top, right and left
7.	Bottom always
8.	positioning and sizing
9.	Absolute to left and bottom
10.	Bottom-right Absolute positioned element
11.	Bottom-left Absolute positioned element
12.	Absolute offset