Ícone CSS usando: antes de impedir que o texto seja agrupado em

Eu tenho um ícone colocado usando:before e o texto a seguir às vezes quebra em duas ou três linhas. Quando envolve, o texto fica abaixo do ícone.

Estou procurando ajuda em CSS para impedir que o texto seja encapsulado sob o ícone.

Aqui está uma imagem mostrando o que estou me referindo:

CSS atual:

a[href $='.pdf']:before, a[href $='.PDF']:before, a[href $='.pdf#']:before, a[href $='.PDF#']:before, a[href $='.pdf?']:before, a[href $='.PDF?']:before {
    content: "\f1c1";
    font-family: 'FontAwesome';
    color: #999;
    display: inline-block;
    margin: 0px 10px 0 0;
    font-size: 24px;
    vertical-align: middle;
}
.form-title:before {
    float: left;
}

Aqui está uma mexida no meu código:violino

questionAnswers(4)

yourAnswerToTheQuestion