Only let certain inner divs control outer div's width

Question

I have the follow html structure:

    

        
    
    &l         


        
      

Answer 1

Make the container display:inline-block; with overflow:auto; so that it automatically stretches to fit the content. Give Block #2 and Block #3 overflow:auto; too so that they stretch to fit their content.

Unfortunately, you need to use JavaScript to get the width to be the width of the image. See my example below, where I fix it with jQuery.

See: http://jsfiddle.net/TFLMX/2