Full -Size -Ansichtsfenster Grenze Bild Ecken abschneiden / aus der Seite ⇐ HTML

[Anonymous]

Ich habe ein Grenzbild, das ich erstellt habe, das ein quadratisches Design mit einem bestimmten Design ist, das ich in jeder Ecke erwarte.

Code: Select all

width: calc(100vw - 95px);
height: calc(100vh - 82px);
< /code>
Und dann sieht es eher wie beabsichtigt aus, aber ich frage mich, warum ich das überhaupt erst tun muss? Ich hätte gehofft, dass ein solcher Wert zumindest mit meinem Bild und Rand ein symmetrisches Quadrat entspricht? Welches CSS fehlt mir, um zu verhindern, dass der Rand vom Ansichtsfenster läuft? class = "snippet-code-html Lang-html PrettyPrint-Override">




Border Image Test

body {
margin: 0;
padding: 0;
}

border-image {
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
pointer-events: none;
border-style: solid;
border-width: 50px;
border-image-slice: 20%;
border-image-repeat: round;
border-image-source: url(https://i.sstatic.net/6JkZjaBM.png);
}