Telerik Grid table width overflowing parent div

Question

I have a telerik grid I am using in an MVC app. The parent div width is set to a max size, and the table is also set to a max-size, but the table portion seems to be ignoring it, even though when I go into the web developer tools, I can see the width.

The html is basically:

<div id="main">
   <div id="grid">
       <table id="TeleTable">
       </table
   </div>
</div>

css:
#main { width: 900px; margin 0 auto; }
#grid { max-width: 900px; }
#TeleTable { max-width: 900px; margin 0px; padding 0px; }

I have also tried width: 100% on the table and increasing the Main width, to no avail.

Thank you reading my post.

Could you possibly post a screenshot of what you're getting? I replicated this code and it seems to be fine. — KreepN

BattlFrog BattlFrog · Accepted Answer · 2012-11-02T17:39:07

After playing around, I figured I had too many columns displayed, so no matter what I set the width to, the table could not shrink because it had to display the data. So I cut down from 8 columns to 5, and now it fits perfect.

Telerik Grid table width overflowing parent div

1 Answers