DEV Community

Eric Fennis

Posted on Jun 24, 2020

Idea for position property

#css #webdev

New idea for the css position property

To overlay elements we use position: absolute; a lot to define behaviour how elements are positioning.
With top, bottom, right, left we define the "location".

What if we extend this property so we can write it in one line?

Example

div {
    position: absolute 10px 4px auto auto;
    /* position: {prop} {top} {right} {bottom} {left};*/

    /* instead of: */
    position: absolute;
    top: 10px;
    right: 4px;
    bottom: auto;
    left: auto;
}