如何让超出div宽度的元素横向滚动

怎么让超出div宽度的元素横向滚动?
贴下css+html

#tar1, #tar2, #tar3
        {
            width: 540px;
            height: 220px;
        }
        #content
        {
            width: 560px;
            height: 220px;
            overflow: auto;
        }
 
 
    <div id="content">
        <div id="tar1" style="background-image: url(/1.jpg)">
        </div>
        <div id="tar2" style="background-image: url(/2.jpg)">
        </div>
        <div id="tar3" style="background-image: url(/3.jpg)">
        </div>
    </div>

这样是纵向的, overflow-x, overflow-y 也试过了
------解决方案--------------------------------------------------------
overFlow-x: scroll ;
overFlow-y: hidden ;   
------解决方案--------------------------------------------------------
div宽度要固定+横向滚动轴
------解决方案--------------------------------------------------------
#tar1, #tar2, #tar3
        {
            width: 540px;
            height: 220px;
        }

你写了这几句后宽度就不可能超出content的560px了，永远不会溢出，所以滚动条不出来

#tar1, #tar2, #tar3
        {
            /*width: 540px;*/
            height: 220px;
        }

这样超出后就出来了
------解决方案--------------------------------------------------------
overflow:auto;