I am trying to create a nested block of left aligned divs, in a parent div that centres the left aligned block on the page. I can get this working fine for one row of left aligned divs, however when the row becomes two rows for some reason the padding increases to fill the width of the parent div.
In the example below I am trying to achieve the same result as the top element with the one below where there are a larger number of divs creating a second row. The only difference between the two elements is one extra div in the lower one.
The parent container has margins set to auto, is a block and centred. The green div is an inline block, auto width and flush left
Any help would be appreciated!