Как сделать несколько спойлеров в одну строку

Еще один вариант... Когда-то где-то нарыл — не помню.
Поскольку в DLE уже реализованы табы (например, на их основе создана форма добавления новости через админпанель и т.д.), то в принципе подключение jQuery-скрипта к движку необязательно — tabs.js есть в системе изначально. Особенно если табы нужны время от времени, а не постоянно их использовать где только можно.

Для того чтобы на DLE сделать табы — не нужно абсолютно никаких телодвижений и установок. Просто когда надо их применить — вставляем в нужное место, например в новость, нижеприведенный код — подлиннее, зато ничего не надо подключать. Стилистика оформления правится прямо здесь же на свой вкус если есть необходимость.

<script type="text/javascript" src="engine/skins/tabs.js"></script>
<!-- К файлу скрипта желательно прописать абсолютный путь  через хттп -->
<div id="dle_tabView1">
<div class="dle_aTab" style="display:none;">
СОДЕРЖИМОЕ ПЕРВОЙ ВКЛАДКИ
</div>
<div class="dle_aTab" style="display:none;">
СОДЕРЖИМОЕ ВТОРОЙ ВКЛАДКИ
</div>
<div class="dle_aTab" style="display:none;">
СОДЕРЖИМОЕ ТРЕТЬЕЙ ВКЛАДКИ
</div>
<div class="dle_aTab" style="display:none;">
СОДЕРЖИМОЕ ЧЕТВЕРТОЙ ВКЛАДКИ
</div>
</div>
<script type="text/javascript">
initTabs('dle_tabView1',Array('НАЗВАНИЕ-1','НАЗВАНИЕ-2','НАЗВАНИЕ-3','НАЗВАНИЕ-4'),0, '100%',0);
<!-- Заменяем на свои оригинальные названия вкладок -->
</script>
<style type="text/css">
    .dle_tabPane{
        height:26px;    /* Height of tabs */
    }
    .dle_aTab{
        border:1px solid #CDCDCD;
        padding:5px;        
        
    }
    .dle_tabPane DIV{
        float:left;
        padding-left:3px;
        vertical-align:middle;
        background-repeat:no-repeat;
        background-position:bottom left;
        cursor:pointer;
        position:relative;
        bottom:-1px;
        margin-left:0px;
        margin-right:0px;
    }
    .dle_tabPane .tabActive{
        background-image:url('engine/skins/images/tl_active.gif');
        margin-left:0px;
        margin-right:0px;    
    }
    .dle_tabPane .tabInactive{
        background-image:url('engine/skins/images/tl_inactive.gif');
        margin-left:0px;
        margin-right:0px;
    }

    .dle_tabPane .inactiveTabOver{
        margin-left:0px;
        margin-right:0px;
    }
    .dle_tabPane span{
        font-family:tahoma;
        vertical-align:top;
        font-size:11px;
        line-height:26px;
        float:left;
    }
    .dle_tabPane .tabActive span{
        padding-bottom:0px;
        line-height:26px;
    }
    
    .dle_tabPane img{
        float:left;
    }
</style>

display none это плохо