内容无法滚动 - HTML - CSS

Question

我的网页视图在内容中使用了dataTable插件。但是当数据不再适合显示在屏幕上时，内容无法滚动。

HTML

<div class="landing">           
    <div class="wrap mainbar-new">
        <div class="why-container">
            <div class="table-responsive">
                <table class="table table-striped table-bordered table-hover" id="table">
                    <thead>
                        <tr>
                            <th align="center">No</th>
                            <th align="center">Time</th>
                            <th align="center">User</th>
                        </tr>
                    </thead>
                    <tbody>
                    <?php $no=1;
                        foreach($data as $row):?>
                            <tr>
                                <td align="center"><?php echo $no;?></td>
                                <td align="center"><?php echo date("d/m/Y", strtotime($row->time));?></td>
                                <td align="center"><?php echo $row->user;?></td>
                            </tr>
                        <?php $no++;
                        endforeach;?> 
                    </tbody>
                </table>
            </div>
        </div>                  
    </div>
</div>

CSS

.landing {
    background-color: #fff;
    padding-top: 10%;
    overflow: auto;
}

有人知道在这种情况下该怎么办？提前谢谢。