a :: nach bei 100% Breite ist viel größer als ein

Question

Ich bin stecken herauszufinden, wie ich :: nach dem verfügbaren Platz in einem Anker zu füllen bekommen.

https://jsfiddle.net/riegersn/g5vhaxa8/

.nsfw::after { 
    content: "NSFW"; 
    text-align: center; 
    vertical-align: middle; 
    width: 100%; 
    height: 100%; 
    top: 0; 
    left: 0; 
    margin: 5px; 
    position: absolute; 
    color: #fff; 
    background-color: #c42c00; 
    display: block; 
} 

Answer 1

Sie wie so gemein?

.nsfw { 
    position:relative; 
} 

.nsfw::after { 
    content: "NSFW"; 
    text-align: center; 
    vertical-align: middle; 
    width: calc(100% - 10px); 
    height: calc(100% - 10px); 
    top:0; 
    left:0; 
    margin: 5px; 
    position: absolute; 
    color: #fff; 
    background-color: #c42c00; 
    display: block; 
}