javascript - Formatting unordered list so it doesn't indent like a paragraph -

javascript - Formatting unordered list so it doesn't indent like a paragraph -

i using jquery.tocify.js javascript plugin programmatically generate table of contents. having bit of problem, though. way plugin operates, pulls every h1, h2, h3, etc. tag , makes nested list, while respecting depth.

the problem i'm having if have h2 long string, formatting in table of contents comes out "wrong". in particular, first line of list item nested, content flows paragraph:

the top level heading

a secondary heading with

a long title

another secondary heading

sorry bad approximation, hope gets i'm seeing across.

is there way set list items indent entire secondary heading same depth, comes out (approximately) as:

the top level heading

a secondary heading with

a long title

here illustration of generated table of contents (with long name):

<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 5th (and successful) try</a></li></ul>

it looks nav , nav-list supposed come bootstrap, i'm not sure bootstrap3 has nav-list class anymore.

edit: yup, looks plugin incompatible bootstrap 3. suppose shop around different plugin.

you should display anchors blocks , set max width them. should forcefulness them loop around @ close maintain @ same indentation.

javascript jquery html css jquery-tocify-js