PRE Tag with Line Numbers using css3

pre Tag with Line Numbers using css3
DEMO
CSS

pre {
    counter-reset: line-numbering;
    font-family: Menlo, Monaco, monospace;
    background-color: #333;
    padding: 5px;
    color: #CCC;
    border-radius: 3px;
    word-break: break-word;
}
pre .line::before {
    content: counter(line-numbering);
    counter-increment: line-numbering;
    padding-right: 1em;
    /* space after numbers */
    width: 1.5em;
    text-align: right;
    opacity: 0.5;
}