.ruler, .ruler li {
    display: inline-block;
    line-height: 13px;
}

    .ruler li span {
        float: right;
    }
    /* IE6-7 Fix */
    .ruler, .ruler li {
        *display: inline;
    }

.ruler {
    background: lightYellow;
    box-shadow: 0 -1px 1em hsl(60, 60%, 84%) inset;
    border-radius: 2px;
    border: 1px solid #ccc;
    color: #ccc;
    margin: 0;
    /*padding-rigt: 1cm;*/
    white-space: nowrap;
}

    .ruler li {
        margin: 5px 0 0;
        text-align: center;
        font-size: smaller;
        position: relative;
        text-shadow: 1px 1px hsl(60, 60%, 84%);
    }

        .ruler li:before {
            content: '';
            position: absolute;
            border-left: 1px solid #ccc;
            height: .64em;
            top: -.64em;
            right: 0em;
        }