I have a div containing divs with content.The outer div has a dynamic width (e.g. 80%).The inner divs have a fixed width (e.g. 100px).The problem is that i want to show only so much inner div's so that no inner div "overflows" / "is cut" as in figure 1.I also want to "distribute" the "free" space as margin between the inner divs equally distributed, as shown in figure 2.I hope somebody understands my problem, and knows how to realize this with css and as less javascript as possible 
P.S.: If it is easy to do, would it be possible to have the first and the last div have a max. margin to the outer borders ?Edit:I created some sample code (JSFiddle link available) where the unneccesary divs already is gone, but the free space isn't taken as margin:\[code\]<div class="outer"> <div class="inner"> 1 </div> <div class="inner"> 2 </div> <div class="inner"> 3 </div></div>?\[/code\]css:\[code\].outer { height: 50px; width: 250px; overflow: hidden;}.inner { width: 100px; height: 50px; background-color: grey; display: inline-block;}?\[/code\]http://jsfiddle.net/dJta4/