Выравнивание блоков по ширине

index.html

<ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
</ul>

style.css

ul {
    font: 14px Verdana, Geneva, sans-serif;
    text-align: justify;
    margin: 0;
    padding: 0;
    
    /* Обнуляем для родителя*/
    line-height: 0;
    font-size: 1px; /* 1px для Opera */
    
    /* Лекарство для IE6-7*/        
    text-justify: newspaper;
    zoom:1;
    
    /* Включаем в работу последнюю строку*/        
    text-align-last: justify;    
}
    ul:after {
            width: 100%; 
            height: 0px;
            visibility: hidden;
            overflow: hidden;
            content: '';
            display: inline-block;
    
    }
        ul li  {
            background: #E76D13;
            width: 98px;
            height: 98px;
            display: inline-block;
            text-align: left;
            border: 1px solid #000;
            
            /* Востанавливаем у потомков, кроме последнего*/
            line-height: normal;
            font-size: 14px;
            
            /* Без него в Opera будет отступ под элементами */
            vertical-align: top; 
            
            /* эмуляция inline-block для IE6-7*/
            //display : inline;
            //zoom : 1;
        }

Выравнивание-блоков-по-ширине.markdown

Выравнивание блоков по ширине

Blocks justify

A Pen by selahssea on CodePen.

License.