# Static

Static is the default position, where elements sit in the normal flow of the page and top and left don't move them.

Apprentice · CSS · Updated October 29, 2026

## After this lesson you can

- Explain how the default static position lays out elements, and why top and left don't move them

## Key takeaways

- The CSS position property has five values, static, relative, absolute, fixed and sticky, and static is the default.
- A static element sits in the normal flow of the page. Block elements, such as a div, each take their own line.
- The top and left properties have no effect on a static element, and it scrolls with the rest of the page.

The CSS `position` property places an element in one of five ways: static, relative, absolute, fixed or sticky.

`static` is the default positioning used when a browser lays out the page, in what's called the normal flow. Block elements, such as a `div`, each start on their own line and take up the space of their own height, and the next element is placed on the line below. The `left` and `top` properties have no effect on a static element. The offsets `top`, `right`, `bottom` and `left` only work on a positioned element, one whose position is anything other than `static`.

```css
.div-2 {
    /* no position is set, so it's static */
    left: 30px;
    top: 30px;
}
```

![Divs 1, 2 and 3 stacked one under another: div 2 sits in its normal place even though its top and left are set](https://fsdtrainingmedia.blob.core.windows.net/public/images/2026/09/8067f63a5bcc4511a0a28d9856543d41.png "Div 2 uses the default position: static")

As the page is scrolled, all elements scroll together.

![After scrolling, divs 1, 2 and 3 have all moved up together, still stacked in the same order](https://fsdtrainingmedia.blob.core.windows.net/public/images/2026/09/28bd8442eee84efbb5a2af7ed011203c.png "Div 2 scrolls with all other divs")

## Check yourself

2 questions to try on the lesson page.

## So what

Every element starts out static, so the normal flow is the baseline: each of the other four position values is a change to it.

## Key terms

- [Positioning scheme](https://www.ask-codey.com/glossary/positioning-scheme)
- [Static positioning](https://www.ask-codey.com/glossary/static-positioning)

Source: https://www.ask-codey.com/lessons/css-position-static