Как сделать так, чтобы текст, который мешает подчеркиванию, «блокировал» подчеркивание пробелами в HTML / CSS?

Question

Есть ли способ воспроизвести следующий эффект с помощью HTML / CSS:

http://i.imgur.com/ASdXb.png

По сути, я хочу, чтобы текст моей ссылки имел приоритет и блокировал пробелы вокруг любых букв, которые пересекают подчеркивание / бордюр внизу.

Answer 1

Это может быть сделано, это выглядит как идеальный пример полезного МЕНЬШЕГО миксина.http://jsfiddle.net/elclanrs/r6Rmh/

p {
    display: inline-block;            
    font: bold 24px Arial;
    border-bottom: 3px solid black;
    text-shadow: -3px 0 white, 3px 0 white;
    line-height: 21px;
}