I am having trouble with managing how text-based content breaks in a multi-column, multi-page layout.
I am using the textify.js jQuery plugin available on CodeCanyon.
The problem I am having relates to lists. Sometimes, list items break incorrectly.
For example, a list may contain the following code:
<ul>
<li>Vous raccommoder avec votre conjoint après avoir exprimé clairement vos attentes de changement, en surmontant vos différends.</li>
<li>Consulter un tiers autorisé (psychologue, conseiller familial, prêtre) à titre individuel pour faire le point sur votre situation personnelle.</li>
<li>Consulter un conseiller/médiateur familial avec votre conjoint.</li>
<li>Vous séparer de fait (sans requérir l'intervention d'un juge, et avec ou sans une convention écrite avec votre conjoint).</li>
<li>Requérir du juge des mesures protectrices de l'union conjugale (en demandant ou non l'attribution du logement familial, c'est-à-dire en menant ou non une vie séparée).</li>
<li>À noter que requérir des mesures protectrices de l'union conjugale pour organiser la vie séparée peut-être un moyen de préparer un divorce unilatéral si le conjoint refuse de divorcer.</li>
<li>Si les conditions en sont réalisées, introduire une action en séparation de corps (cas échéant d'accord avec votre conjoint).</li>
</ul>
The columns are set to a height of 330px.
In this layout, some of the list items break mid-item and are continued on the next column. That isn’t a real problem, if the result was not a new list item being started when that happens.
Effectively, it breaks and creates a new <li>
as such:
<ul>
<li>Vous raccommoder avec votre conjoint après avoir exprimé clairement vos attentes de changement, en surmontant vos différends.</li>
<li>Consulter un tiers autorisé (psychologue, conseiller familial, prêtre) à titre individuel pour faire le point sur votre situation personnelle.</li>
<li>Consulter un conseiller/médiateur familial avec votre conjoint.</li>
<li>Vous séparer de fait (sans requérir l'intervention d'un</li>
<li>juge, et avec ou sans une convention écrite avec votre conjoint).</li>
<li>Requérir du juge des mesures protectrices de l'union conjugale (en demandant ou non l'attribution du logement familial, c'est-à-dire en menant ou non une vie séparée).</li>
<li>À noter que requérir des mesures protectrices de l'union conjugale pour organiser la vie séparée peut-être un moyen de préparer un divorce unilatéral si le conjoint refuse de divorcer.</li>
<li>Si les conditions en sont réalisées, introduire une action en séparation de corps (cas échéant d'accord avec votre conjoint).</li>
</ul>
If you notice, the 7 <li>
elements are now 8 with a new <li>
created mid-sentence after l’intervention d’un of list item 4.
What I’d like to do is control that. Either of the following options would be satisfactory to me:
- The line breaks to the next column but does not create a new
<li>
- The column height grows only enough to allow the
<li>
not to break onto a new column. - The
<li>
does not break mid-sentence, but rather if it is too long to display in the column, it breaks before the<li>
You can see the layout issue and problems at the following URL:
http://alisamii.dyndns.org/ergonomiq/domains/clients/sosd2/
Any assistance would be most appreciated.