Divide Width of Element Between Child Divs With CSS

Question

I have a varying number of inline-block divs that I want to collectively take up 100% of their parent. Can this be done without JavaScript? The only way I can think o

Answer 1

The accepted answer missed an important CSS property which is necessary to work:

table-layout: fixed;

This is the correct answer:

HTML:

    
Item 1
 
        
Item 2
 
        
Item 3
 
        
Item 4
 
    

CSS:

div.outer {display:table; table-layout: fixed;}
div.middle {display:table-row;}
div.inner {display:table-cell;}