Форматирование неупорядоченного списка, чтобы он не отступал как абзац

Question

Я использую javascript плагин jQuery.tocify.js для программной генерации оглавления. У меня есть небольшая проблема, хотя. То, как работает плагин, он тянет каждый h1, h2, h3и т. д. и создает вложенный список, соблюдая при этом глубину.

Проблема в том, что если у меня есть h2 с длинной строкой форматирование в оглавлении получается "неправильным". В частности, первая строка элемента списка является вложенной, но содержимое передается как абзац:

Заголовок верхнего уровня

Вторичный заголовок с

длинный заголовок

Еще один вторичный заголовок

Извините за плохое приближение, но я надеюсь, что получится то, что я вижу.

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

Заголовок верхнего уровня

Вторичный заголовок с

длинный заголовок

Вот пример сгенерированного оглавления (с длинным именем):

<ul id="tocify-header7" class="tocify-header nav nav-list">
  <li class="tocify-item active" data-unique="the-fifth-(and-successful)-try" style="cursor: pointer;"><a>The Fifth (and Successful) Try</a></li></ul>

Это выглядит как nav а также nav-list должны быть из Bootstrap, но я не уверен, что Bootstrap3 даже имеет nav-list класс больше.

Изменить: Да, похоже, что плагин несовместим с Bootstrap 3. Я полагаю, я буду искать другой плагин.

Answer 1

Вы должны отобразить якоря как блоки и установить для них максимальную ширину. Это должно заставить их зацикливаться на закрытии, но держать все это в одном и том же отступе.