相关疑难解决方法(0)

我有一个部门,我想在其中显示图像,然后单击打开它们在灯箱中.我把它们漂浮在左边并将它们显示为内联.设置overflow-x滚动但是一旦行空间不够,它仍会将图像放在下面.我想让它们在内联并在需要时显示水平滚动.

注意:我无法改变里面图像的结构.它必须是一个锚点内的img.我的灯箱需要它.

HTML:

<div id="myWorkContent">
    <a href="assets/work/1.jpg"><img src="assets/work/1.jpg" height="190" /></a>
    <a href="assets/work/2.jpg"><img src="assets/work/2.jpg" height="190" /></a>
    <a href="assets/work/3.jpg"><img src="assets/work/3.jpg" height="190" /></a>
    <a href="assets/work/4.jpg"><img src="assets/work/4.jpg" height="190" /></a>
    <a href="assets/work/5.jpg"><img src="assets/work/5.jpg" height="190" /></a>
    <a href="assets/work/6.jpg"><img src="assets/work/6.jpg" height="190" /></a>
</div><!-- end myWorkContent -->

CSS:

#myWorkContent{
    width:530px;
    height:210px;
    border: 13px solid #bed5cd;
    overflow-x: scroll;
    overflow-y: hidden;
}
#myWorkContent a {
    display: inline;
    float:left
}

我知道这是非常基本的,但我无法完成它.不知道出了什么问题.