tags:

views:

68

answers:

1

Hello, I'm having an issue aligning three divs inside a parent div, the effect I need is the following

|IMAGE| +TEXT+ |IMAGE|

Each div contains an Image (2) and the text (1) respectively. Aligning them is easy, the problem is that I want the CENTER div to auto width to the size of the browsers' window and keep the other IMAGE divs always on the right and left side respectively.

Something like this for example, if the user maximizes the window:

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

As you can see, the idea is that the center div grows, and auto width but keeping the structure.

How could I get that behaviour? Thanks in advance.

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

If that still doesn't behave how you want, please give more detailed requirements.

Bobby Jack
That's just what I was looking for. I had missed the div-2 display inline part. Thanks.
lidermin