HTML and CSS Reference
Figure 5.11 A relatively positioned element including left and top box offset proper-
Here the second <div> element, the element with the class of offset , has a position
value of relative and two box offset properties, left and top . This preserves the ori-
ginal position of the element, and other elements are not allowed to move into this space.
Additionally, the box offset properties reposition the element, pushing it 20 pixels from the
left and 20 pixels from the top of its original location.
With relatively positioned elements, it's important to know that the box offset properties
identify where an element will be moved from given its original position. Thus, the left
property with a value of 20 pixels will actually push the element towards the right, from
the left, 20 pixels. The top property with a value of 20 pixels, then, will push an element
towards the bottom, from the top, 20 pixels.