Ordered List style question

This forum is for all Flare issues related to importing files or projects.

Ordered List style question

Postby Matze on Mon Oct 26, 2020 12:34 am

Hi all,
I try to figure out why my ordered list does not correctly work:

Ordered_List_Table.JPG



This is the HTML:
---------------------
Code: Select all
 <td class="TableStyle-Tab_Linie_schmal-BodyC--TabText_LB">
                        <ol class="Tab_Pruef_Ebene_1">
                            <li>Ebene 1</li>
                            <li>Ebene 1</li>
                        </ol>
                        <ol class="Tab_Pruef_Ebene_2">
                            <li>Ebene 2</li>
                            <li>Ebene 2</li>
                            <li>Ebene 2</li>
                        </ol>
                        <ol class="Tab_Pruef_Ebene_1">
                            <li>Change to 3. Ebene 1</li>
                        </ol>
                    </td>
                    <td class="TableStyle-Tab_Linie_schmal-BodyC--TabText_LB">
                        <p class="TabText_LB">&#160;</p>
                    </td>
                    <td class="TableStyle-Tab_Linie_schmal-BodyA--TabText_LB">
                        <p class="TabText_LB">&#160;</p>
                    </td>



This is the CSS:
------------------

Code: Select all
ol.Tab_Pruef_Ebene_1   /* Nummerierung Prueftabelle - erste Ebene - Media Non-Print */

{
   padding-left: 20px;
   counter-reset: Tab_Pruef_Ebene_1;
   list-style-type:none;
}

ol.Tab_Pruef_Ebene_1 li:before   /* Pseudoklasse - Nummerierung Prueftabelle - erste Ebene - Media Non-Print */
{
   content: counter(Tab_Pruef_Ebene_1) ".  ";
   counter-increment: Tab_Pruef_Ebene_1;
}

ol.Tab_Pruef_Ebene_1 li:after   /* Pseudoklasse - Nummerierung Prueftabelle - erste Ebene - Media Non-Print Matze: funzt noch nicht richtig */
{
   counter-reset: initial;
}

ol.Tab_Pruef_Ebene_2   /* Nummerierung Prueftabelle - zweite Ebene - Media Non-Print */
{
   padding-left: 40px;
   counter-reset: Tab_Pruef_Ebene_2;
   list-style-type:none;   
}

ol.Tab_Pruef_Ebene_2 li:before   /* Pseudoklasse - Nummerierung Prueftabelle - zweite Ebene - Media Non-Print */
{
   content: counter(Tab_Pruef_Ebene_1)"."counter(Tab_Pruef_Ebene_2,decimal) ".  ";
   counter-increment: Tab_Pruef_Ebene_2;   
}




I guess there is something wrong with the counter reset and with the pseudo classes and then I belive one problem is that flare starts my second <ol class="Tab_Pruef_Ebene_1"> in its own new class.
I´ve try to manually set this second ol class to start value = 3, but it does not work. It works, when I change the second ol class manually in the html view, then the "Tab_Pruef_Ebene_1" is nested, but I want to figure out how it works with my working CSS classes only.
You do not have the required permissions to view the files attached to this post.
Matze
Sr. Propeller Head
 
Posts: 109
Joined: Mon Jun 20, 2016 10:35 pm

Re: Ordered List style question

Postby SteveS on Mon Oct 26, 2020 2:22 pm

Your second instance of the higher-level list is a new instance and therefore restarts at one.

You can either create the lower-level list inside the upper-level list tags (ie create a list with items one to three and then insert a new list with 2.2, 2.2, 2.3 etc) or you can hard code the new upper-level list to start on 3.

A third, and in my opinion better, option is to do away with ordered lists and use Flare's autonumber feature.

The fourth option is to open the topic in a text editor and remove the closing ordered list tag after item 2, and the opening ordered list tag after 2.3. This will have the same effect as my first suggestion, making a continuous upper-level list with a sub-list.
Image
Steve
Life's too short for bad coffee, bad chocolate, and bad red wine.
SteveS
Senior Propellus Maximus
 
Posts: 2027
Joined: Tue Mar 07, 2006 5:06 pm
Location: Adelaide, far side of the world ( 34°56'0.78\"S 138°46'44.28\"E).

Re: Ordered List style question

Postby SergeiS on Mon Oct 26, 2020 9:48 pm

We configured complex selectors for nested lists, so they work automatically
ol > ol
ol > ol > ol
This way, we just insert a Numbered List and add the content, while the numbers change automatically.
SergeiS
Jr. Propeller Head
 
Posts: 5
Joined: Tue May 14, 2019 9:18 am


Return to Importing

Who is online

Users browsing this forum: No registered users and 8 guests

cron