This question already has an answer here:

Line under text with spaces. Is it possible via html & css? 5 answers CSS technique for a horizontal line with words in the middle 19 answers

в CSS, как я могу сделать что-то вроде:

---Item---

с чертой, связанной как линия?

я думал о:

border-bottom: 3px solid #000;

но тогда я не могу переместить строку вверх, плюс строка будет за текстом, а не окружать текст

мой HTML

<ul>
    <li class="sub-menu-item" ><a href="#">FACULTY&STAFF</a></li>
</ul>

(если возможно, я бы хотел не касаться HTML)

Возможно ли все вышеперечисленное с помощью CSS или я все-таки должен использовать изображение?

я стремлюсь к ie8 и выше (и, конечно, ко всем новым браузерам)