Home Forums Weaver II Theme Weaver II Pro Adding CSS Counter numbered lists to page

This topic contains 2 replies, has 3 voices, and was last updated by  Weaver 1 week, 4 days ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #51806

    Confucius
    Participant

    I have these css rules but cannot get it to work with my single page. I battle to implement the counter function.

    body {
        font-family: Arial, sans-serif;
        color: #030303;
        font-size: 12px;
        font-weight: 100;
        counter-reset: num;
    }
    
    ol {
        list-style: none;
    }
    
    ol li:before {
        counter-increment: num;
        counter-reset: sub_num;
        content: counter(num) ". ";
    }
    
    ol ol li:before {
        counter-increment: sub_num;
        counter-reset: sub_sub_num;
        content: counter(num) "." counter(sub_num) " ";
    }
    
    ol ol ol li:before {
        counter-increment: sub_sub_num;
        counter-reset: sub_sub_sub_num;
        content: counter(num) "." counter(sub_num) "." counter(sub_sub_num) " ";
    }
    
    ol ol ol ol li:before {
        counter-increment: sub_sub_sub_num;
        counter-reset: sub_sub_sub_sub_num;
        content: counter(num) "." counter(sub_num) "." counter(sub_sub_num) "." counter(sub_sub_sub_num) " ";
    }
    
    ol ol ol ol ol li:before {
        counter-increment: sub_sub_sub_sub_num;
        counter-reset: none;
        content: counter(num) "." counter(sub_num) "." counter(sub_sub_num) "." counter(sub_sub_sub_num) "." counter(sub_sub_sub_sub_num) " ";
    }
    
    ol li {
        position: relative;
        list-style: none;
        font-weight: 600;
        font-size: 145%;
        margin-left: -35px;
    }
    
    ol ol li {
        display: block;
        margin: 6px 7px 1.2em -10px;
        font-weight: 100;
        font-size: 100%;
        padding-left: 2.2em;
        text-indent: -2.2em;
    }
    
    ol ol ol li {
        margin-left: -35px;
        padding-left: 3em;
        text-indent: -3em;
    }
    
    p {
        font-weight: 100;
        font-size: 100%;
    }
    
    Any help and guidance will be apprecieated.  I have three simalar pages, which I am need to add.
    
    Thanks in advance for your help.
    
    
    #51807

    scrambler
    Moderator

    You are going to need to give us more information here…

    First give a link to your page

    Second describe what in that page is not as you liked and how you are trying to make it..

    #51808

    Weaver
    Keymaster

    This is not theme related but a general css issue. Scrambled is certainly welcome to follow up as he really enjoys new css puzzles, but in general we try to stick to theme related issues.

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.