# Absolute Positioning

### Absolute Positioning

The **`absolute`** value for the **`position`** property is different from the **`relative`** value in that an element with a **`position`** value of **`absolute`** will not appear within the normal flow of a document, and the original space and position of the absolutely positioned element will not be preserved.

Additionally, absolutely positioned elements are moved in relation to their closest relatively positioned parent element. Should a relatively positioned parent element not exist, the absolutely positioned element will be positioned in relation to the **`<body>`** element.

&#x20;:point\_down: Take a look at how this works inside some code:

```markup
<section> 
 <div class="offset">...</div>
 </section>
```

```css
section {  
position: relative;}
div {  
position: absolute;  
right: 20px;  
top: 20px;}
```

In this example the **`<section>`** element is relatively positioned but doesn’t include any box offset properties. Consequently its position doesn’t change. The **`<div>`** element with a class of `offset` includes a `position` value of **`absolute`**. Because the **`<section>`** element is the closest relatively positioned parent element to the **`<div>`** element, the **`<div>`** element will be positioned in relation to the `<section>` element.

With relatively positioned elements, the box offset properties identify in which direction an element would be moved in relation to itself. With absolutely positioned elements, the box offset properties identify in which direction an element will be moved in relation to its closest relatively positioned parent element.

As a result of the `right` and `top` box offset properties, the `<div>` element will appear `20` pixels from the `right` and `20` pixels from the `top` of the `<section>`.

Because the `<div>` element is absolutely positioned, it does not sit within the normal flow of the page and will overlap any surrounding elements. Additionally, the original position of the `<div>` is not preserved, and other elements are able to occupy that space.<br>
