<div class="sample">sample</div>
/* chrome safari opera */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
    .sample {
        background-color: gray;
    }
}

/* chrome opera */
@media screen and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm) {
    .sample {
        background-color: red;
    }
}

/* safari */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
    _::-webkit-full-page-media, _:future, :root .sample {
        background-color: cornflowerblue;
    }
}

/* Firefox */
@-moz-document url-prefix() {
    .sample {
        background-color: orange;
    }
}

/* Edge */
@supports (-ms-ime-align: auto) {
	.sample {
        background-color: blue;
    }
}

/* Edge */
_:-ms-lang(x)::backdrop,
.sample {
    background-color: blue;
}

/* IE11 */
_:-ms-lang(x)::-ms-backdrop,
.sample {
    background-color: deepskyblue;
}

.sample {
    color: #fff;
    font-weight: bold;
    line-height: 100px;
    text-align: center;
    width: 100px;
    height: 100px;
    margin: auto;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.