CSS position: absolute with position: relative "top" not working

Question

I'm working on a site that uses position: relative div containing position: absolute divs. I understand the concept I believe, and everything works great except I cannot seem to get the `top` attribute to do anything. left works, but not top. My code is as follows: ```

``` CSS ``` #imagemenu { position: relative; } .logo img { position: absolute; width: 20%; top: 50%; left: 40%; } .west img { position: absolute; width: 30%; left: 15%; } .southwest img { position: absolute; width: 30%; le…

Accepted Answer

Define your parent div height, and then use top `%` in top `absolute` div

Like this:

```
.parent {
    position: relative;
    height: 100px;
}
.child {
    position: absolute;
    top: 50%;
}
```

If you don't define your parent div height then use `px value in top`.

```
.child {
    top: 100px;
}
```

CSS position: absolute with position: relative "top" not working

Solution

Problem