How do I apply Grid css to a static html table without the vertical scroll?

[Ryan Lege]

This is just a static table I'd like to apply the overall Kendo css theme of my site to. Unfortunately, I cannot get rid of the vertical scroll to the right of the table. I've tried everything. Any ideas?  


<div class="k-widget k-grid" id="Grid">
      <div class="k-grid-header">
        <div class="k-grid-header-wrap">
          <table cellspacing="0">
            <tr>
              <th>Type</th>
              <th>Estimate</th>
              <th>Actual</th>
              <th>Description</th>
            </tr>
          </table>
        </div>
      </div>
      <div class="k-grid-content">
        <table cellspacing="0">
          <colgroup>
            <col />
            <col />
            <col />
            <col />
            <col />
          </colgroup>
          <tbody>
            @foreach (var item in Model.EventFundings)
            {
                                     <tr >
                                      <td>
                                        @item.FundingCostTypeTitle
                                      </td>
                                      <td>
                                        @item.EstimateCost
                                      </td>
                                      <td>
                                        @item.ActualCost
                                      </td>
                                      <td>
                                        @item.Description
                                      </td>
                                    </tr>
            }
          </tbody>
        </table>
      </div>
    </div>

[ColinBowern]

Did you try settings scrollable to false? (i.e. $("#grid').kendoGrid({ ...., scrollable: false, ... });

[Ryan Lege]

I tried that and it only applies it to the Header. The rest of the grid still has the scroll. My table structure must be wrong.