1

我创建了一个使用Kendo PanelBar. 在酒吧里面我有一张桌子:

我正在处理Kendo(Telerik) Panelbar其中包含一个表格的页面。

这是html:

<ul id="#panelBar-ID" class="operatorPanel" style="margin-bottom: 10px;">
    <li class="operatorGroup">

        <table style="width: 100%;">
           <tr><td>Some content</td></tr>
        </table>
       <div>
            <div class="table-responsive" style="background-color: white;">
                <table style="width:100%;" class="table dataTable">
                    <tr>
                        <th></th>
                        <th class="currencyRightAlign">Column1</th>
                        <th class="currencyRightAlign">Column2</th>
                        <th class="currencyRightAlign">Column3</th>
                        <th class="currencyRightAlign">Column4</th>
                        <th class="currencyRightAlign">Column5</th>
                        <th class="currencyRightAlign">Column6</th>
                        <th class="currencyRightAlign">TotalSales</th>
                    </tr>
                    <tr>
                        <td>Sales</td>
                        <td class="currencyRightAlign">@Html.DisplayFor(item => @file.Sales1, "CurrencyFormatter")</td>
                        <td class="currencyRightAlign">@Html.DisplayFor(item => @file.Sales2, "CurrencyFormatter")</td>
                        <td class="currencyRightAlign">@Html.DisplayFor(item => @file.Sales3, "CurrencyFormatter")</td>
                        <td class="currencyRightAlign">@Html.DisplayFor(item => @file.Sales4, "CurrencyFormatter")</td>
                        <td class="currencyRightAlign">@Html.DisplayFor(item => @file.Sales5, "CurrencyFormatter")</td>
                        <td class="currencyRightAlign">@Html.DisplayFor(item => @file.Sales6, "CurrencyFormatter")</td>
                        <td class="currencyRightAlign">@Html.DisplayFor(item => @file.TotalSales, "CurrencyFormatter")</td>
                    </tr>
                </table>
            </div>
        </div>
    </li>
</ul>

<script type="text/javascript">

      $(window).resize(function () {
         if ($("#tblScroll").width() < 500) {
              $("#tblScroll").css({ 'overflow-x': 'scroll' });
         }
       });
</script>

当表格的宽度小于某个数字时,会显示水平滚动条。

当我向左再向右滚动时,桌子上出现了一些奇怪的垂直线: 在此处输入图像描述

我怎样才能摆脱这个缺陷?

4

0 回答 0