могу понять, как это сделать с помощью CSS. Если я просто использую<br> тег, он работает безупречно, но я пытаюсь избежать этого по очевидным причинам.

В основном, я просто хочу.feature_desc span начать с новой строки, но:

Если я сделаю это встроенным элементом, у него не будет перевода строки.Если я сделаю его блочным элементом, он расширится, чтобы уместиться на всю строку, поместив каждый из этих значков в отдельную строку, и потратит впустую тонны пространства на экране (каждый.feature_wrapper будет немного другого размера, но ни один из них не будет таким же широким, как весь экран.)

Пример кода: это работает, но используетbr тег:

<li class='feature_wrapper' id='feature_icon_getstart'> 
    <span style='display: none;' class='search_keywords'>started</span> 
    <span class='feature_icon spriteicon_img' id='icon-getstart'><a href='getstarted/index.html' class='overlay_link'></a></span><br/>
    <span class='feature_desc'><a href='getstarted/index.html' >Getting Started Wizard</a></span> 
</li>

Я хочу стилизовать это с помощью CSS для достижения того же результата:

<li class='feature_wrapper' id='feature_icon_getstart'> 
    <span style='display: none;' class='search_keywords'>started</span> 
    <span class='feature_icon spriteicon_img' id='icon-getstart'><a href='getstarted/index.html' class='overlay_link'></a></span>
    <span class='feature_desc'><a href='getstarted/index.html' >Getting Started Wizard</a></span> 
</li>

Есть идеи? Или я иду по этому пути неправильно?