CSS выравнивает три divs по горизонтали

У меня проблема с выравниванием трех div внутри родительского div, эффект, который мне нужен, следующий

|IMAGE| +TEXT+ |IMAGE|

Каждый div содержит изображение (2) и текст (1) соответственно. Выравнивание их очень просто, проблема в том, что я хочу, чтобы div CENTER автоматически увеличивался до размера окна браузеров и сохранял другие div файлы IMAGE всегда на правой и левой стороне соответственно.

Что-то вроде этого, например, если пользователь максимизирует окно:

|IMAGE| +++++++++++++++++++TEXT++++++++++++++++++++++++ |IMAGE|

Как вы можете видеть, идея состоит в том, что центр div растет, а ширина авто, но сохраняет структуру.

Как я мог получить это поведение? Спасибо заранее.

Ответ 1

#container { text-align: center; }
#div-1 { float: left; }
#div-2 { display: inline; }
#div-3 { float: right; }

Если это все еще не ведет себя так, как вы хотите, просьба дать более подробные требования.

Ответ 2

Вот еще одна встроенная реализация для трех изображений рядом:

<div style="text-align:center">

    <div style="float: left"><img src="image1.png"/></div>

    <div style="display: inline"><img src="image2.png"/></div>

    <div style="float: right"><img src="image3.png"/></div>

</div>