position: relative का उपयोग
position: relative प्रॉपर्टी एलिमेंट को उसकी सामान्य स्थिति (नॉर्मल फ्लो) के सापेक्ष पोजिशन करने की अनुमति देती है। एलिमेंट अभी भी डॉक्यूमेंट फ्लो में जगह घेरता है, लेकिन top, right, bottom, left प्रॉपर्टीज का उपयोग करके उसे ऑफसेट किया जा सकता है।
उदाहरण
<!DOCTYPE html>
<html>
<head>
<style>
div {
position: relative;
left: 20px;
border: 3px solid blue;
}
</style>
</head>
<body>
<h1>Positioning Element</h1>
<div>
div element with position: relative;
</div>
</body>
</html>
उपयोग: यह अक्सर position: absolute वाले चाइल्ड एलिमेंट्स के लिए पोजिशनिंग कॉन्टेक्स्ट (कंटेनिंग ब्लॉक) बनाने के लिए उपयोग किया जाता है।