Can a div fill up the entire viewport with a pixel-based margin, not using the CSS3 calc property?

Question

I\'ve found a (hacky) way to have a div take up the full viewport of a browser, minus a pixel-based margin, by utilizing the CSS3 calc property like so (see fiddle)

Answer 1

        html, body {
            height: 100%;
            margin: 0;
            overflow: hidden;
        }

        div {
            height: 100%;
            margin: 0;
            width: 100%;
            position: relative;
        }
        div::before {
            position: absolute;
            top: 13px;
            left: 13px;
            bottom: 13px;
            right: 13px;
            content: '';
            background: linear-gradient(red, yellow);
        }

You can simply try the following CSS:

    html, body {
        height: 100%;
        margin: 0;
        overflow: hidden;
    }

    div {
        height: 100%;
        margin: 0;
        width: 100%;
        position: relative;
    }
    div::before {
        position: absolute;
        top: 13px;
        left: 13px;
        bottom: 13px;
        right: 13px;
        content: '';
        background: linear-gradient(red, yellow);
    }