Центрировать блок с элементами с float:left внутри

[Skyrazor]

Есть div с изображениями (на картинке - красный блок), которые выводятся друг за другом. Ширина div позволяет уместить несколько фотографий одинакового размера в ряд (в зависимости от ширины, она меняется). Если в ряду остаётся меньше фотографий, чем вмещается в ряду, они должны выравниваться по левому краю.

div с этими всеми фотографиями в свою очередь нужно отцентрировать относительно родительского блока (на картинке - зелёный блок), чтобы поля вокруг div с левой и правой стороны были одинаковы.

div с фотками успешно центрируется относительно родительского с помощью text-align: center, но стоит мне прописать float: left или align=left к фотографии, как центрирование блока относительно родительского утрачивается и весь блок уезжает влево. Как решить проблему?

[Naive]

Внешний инлайн-блок в любом случае будет расширяться на всю ширину. Спасти может только абсолютное позиционирование, но тогда он будет вырван из потока, что не есть гуд.
Есть прстой хак для инлайн-блоков: насыпать снизу плейсхолдеров.
http://jsfiddle.net/Na1ve/cuvzc6zs/
Помогает как при выравниванию по центру, так и для выравнивания по ширине.

[Skyrazor]

Сообщение от Naive

насыпать снизу плейсхолдеров.

Работает, спасибо! Я так понимаю, их нужно вставить в количестве n-1, где n - максимальное количество элементов в ряду

[Naive]

Да, не меньше. Большее количество ни на что влиять не будет (кроме производительности).