CSS：将子div宽度自动设置为内容，而不是完整的父宽度

Question

我的css有些问题。对标题感到抱歉，我不太清楚如何用几句话来解释它，但现在就是这样。这是我遇到的问题。我有一个包装父div，它与页面的中心对齐。在那个div里面我有另一个div，那个div里面有图片。问题是我将子div设置为width：auto，宽度始终是父div的全长。我想要的是自动缩放与其中的内容一样大，所以我可以将它放在父div中。这是我的意思的图片。

enter image description here

灰色部分是我的父div，包装器，红色部分是我的孩子div，gameswrapper。我希望gameswrapper与其中的游戏图片大小相同

这是我的css

function getName()
{
   echo "lion";
}

这是我的HTML

#wrapper {
background: #ddd;
width: 70%;
max-width: 70%;
margin: auto;
padding: 10px;
font-family: 'CaviarDreamsBold';
}
#gamesdisplay {
    display:block;
}
#searchdisplay {
    display:block;
}
.artwork {
margin: 6px;
width: 150px;
height: 230px;  
background: #666;
display: inline-block;
cursor: pointer;
}

任何人都知道如何解决这个问题？