堆叠内联块div并保持响应

Question

我不太确定我想知道应该怎样做的方式，我觉得会有多种选择。

所以我试图对齐设置为内联块的div，使它们像文本一样流动，并在屏幕尺寸变小时跳转（响应）。此外，它必须只使用CSS样式。

它们必须看起来像这样（div之间的间距不是这里的关注点）：

我的代码看起来像这样（#item_*包含用于设置其大小的图片和文字）：

<div id="main_wrapper">
    <div id="content_wrapper">
        <div id="content">
            <div id="item_container">
                <div id="item"></div>
                <div id="item"></div>
                <div id="item"></div>
                <div id="item"></div>
                <div id="item"></div>
                <div id="item"></div>
            </div>
        </div>
    </div>
</div>

我的风格如下：

#main_wrapper{
    overflow: auto;
}

#content_wrapper{
    max-width: none;
    margin: 64px 194px;
    margin-right: 26px;
}

#content{
    padding:28px 33px;
    padding-bottom: 5px;
    overflow: auto;
}

#item_container{
    text-align: center;
}

#item{
    text-align: center;
    display: inline-block;
}

#content_wrapper{
    background-color: rgba(255,255,255,0.85);
    max-width: 462px;
    font-family: "Courier New", Courier, monospace;
}