রিলেটিভ পজিশনিং HTML এলিমেন্টের পজিশনকে সেটি সাধারণত যেখানে থাকে সেখানে থেকে পরিবর্তন করে। অর্থাৎ "left:20" এলিমেন্টের LEFT পজিশনে ২০ পিক্সেল যোগ করে।
position প্রোপার্টির সাথে top এবং left দুটি মান ব্যবহার করে HTML এলিমেন্টকে ডকুমেন্টের যেকোনো জায়গায় সরানো যায়।
- বামে সরান: left-এর জন্য নেগেটিভ মান ব্যবহার করুন।
- ডানে সরান: left-এর জন্য পজিটিভ মান ব্যবহার করুন।
- উপর সরান: top-এর জন্য নেগেটিভ মান ব্যবহার করুন।
- নিচে সরান: top-এর জন্য পজিটিভ মান ব্যবহার করুন।
উদাহরণ
নিচের কোডটি রান করে রিলেটিভ পজিশনিং বুঝতে পারেন:
<html>
<head></head>
<body>
<div style="position:relative; left:80px; top:2px; background-color:yellow;">
This div has relative positioning.
</div>
</body>
</html>