Как выровнять блоки по ширине родительского контейнера?

Question

[Олег]

Имеется блок, растягивающийся по ширине на всю страницу, в нем множество более мелких блоков-картинок. Необходимо выравнять картинки по ширине родительского блока.
Пытаюсь сделать это следующим образом - родительскому блоку прописал text-align: justify;
Дочерним блокам задал display: inline-block;

При таком подходе большинство блоков картинок выравниваются как надо, кроме последней строки. Последняя строка выравнивается по левому краю.
Пример jsfiddle.net/KPDZ5
Почему последняя строка не выравнивается по ширине? Как решить эту проблему?

Comments

[Halonest]

(чтобы не плодить новых тем по сходному вопросу - спрошу здесь)

Как можно в исходном примере у топикстартера модифицировать код таким образом, чтобы выравнивание блоков-картинок в самой нижней (неполной) строке оставалось по левому краю, но отступы в них соответствовали отступам в "полных" строках - то есть блоки-картинки в самой нижней строке оставались строго под соответствующими блоками-картинками верхней строки? (разумеется, вопрос предполагает, что все блоки-картинки в родительском блоке имеют равную ширину)

Для наглядности задачи:

Answer 1

[Аркадий Бутерманов]

kristinlbradley.wordpress.com/2011/09/15/cross-bro...

Т.е. в Вашем случае как-то так:

.images {
    text-align: justify;
    width: 100%;
    background-color: #ff0000;
    position: relative;
    text-align-last: justify;
}

.image {
    width: 100px;
    height: 100px;
    display: inline-block;
    background-color: #00ff00;
}

.images:after {
  content: "";
  display: inline-block;
  width: 100%;
}

Comments

[Олег]

Спасибо, то что нужно