垂直滚动div

Question

是否可以仅垂直滚动外部div而内部div（包含较小的div）只能水平滚动？ 我正在使用cordova作为移动应用程序，我可以水平和垂直滚动外部div。内部div不会滚动。

这是外部div（#container）的CSS，内部div（＃line1等）以及内部的其他div。

#container {
   height: 100%;
   overflow-y: auto;
}

#line1, #line2, #line3 {
    display: table;
    width: 50em;
    overflow-x: auto;
}

.smallDivs {
    height: 100%;
    display: inline-block;
    vertical-align: middle;
    margin-right: -6%;
}

HTML结构如下所示：

<div id="container">
    <div id="line1">
        <div class="smallerDivs"><div>
        <div class="smallerDivs"><div>
    </div>
    <div id="line2">
        <div class="smallerDivs"><div>
        <div class="smallerDivs"><div>
    </div>
    <div id="line3">
        <div class="smallerDivs"><div>
        <div class="smallerDivs"><div>
    </div>
</div>