使用动态宽度居中多行内嵌块

下面是HTML:

<div>
    <div>
        <div>large test <br /> block #1</div>
        <div>large test <br /> block #2</div>
        <div>large test <br /> block #3</div>
        <div>large test <br /> block #4</div>
        <div>large test <br /> block #5</div>
    </div>
</div>

以及CSS:

div {
    background: #f00;
    text-align: center;
}

div > div {
    display: inline-block;
    margin: auto;
    background: #0f0;
    text-align: left;
}

div > div > div {
    background: #00f;
    display: inline-block;
}

测试: http://jsfiddle.net/wnV3H/ 您可以看到,当宽度足够大,可以将所有内容都放在一行中时,效果很好。但是,当内容被包装成两行或更多行时,第二个div采用整个宽度,并且不居中。这样地:

#1 #2 #3 #4 (blank)
#5          (blank)

我想要的是:

(blank) #1 #2 #3 #4 (blank)
(blank) #5          (blank)

不是这个:

(blank) #1 #2 #3 #4 (blank)
(blank)     #5      (blank)

有什么解决办法吗?提前感谢。