# CSS to Change Table Width

**URL:** <https://forums.knack.com/t/css-to-change-table-width/8713>\
**Category:** API & Custom Code\
**Created:** [February 24, 2021, 4:45pm UTC](https://forums.knack.com/t/css-to-change-table-width/8713 "2021-02-24T16:45:44Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![SteveTobin29697](https://avatars.discourse-cdn.com/v4/letter/s/7feea3/32.png) [@SteveTobin29697](https://forums.knack.com/u/SteveTobin29697)\
**Post date:** [February 24, 2021, 4:45pm UTC](https://forums.knack.com/t/css-to-change-table-width/8713/1 "2021-02-24T16:45:44Z")

</div>

Hi,

Does anybody know how I can prevent a Table always filling out to 100%?

If you only have 2 or 3 columns it looks terrible if these are full screen width.

Thanks.

---

<div class="post-metadata">

**Author:** ![SteveTobin29697](https://avatars.discourse-cdn.com/v4/letter/s/7feea3/32.png) [@SteveTobin29697](https://forums.knack.com/u/SteveTobin29697)\
**Post date:** [February 26, 2021, 10:03am UTC](https://forums.knack.com/t/css-to-change-table-width/8713/2 "2021-02-26T10:03:53Z")

</div>

Thanks Dean.

Here is what I found to work best so far after much trial and error.

If anybody can improve upon it I would welcome the feedback.

Note use of !important at the Application level.

/\* At a View level \*/  
/\* \*/  
/\* Table \*/  
#view\_695 table.kn-table-table {  
width: unset;  
}  
/\* Report (e.g. Pivot Table) \*/  
#view\_695 .kn-report-row .column {  
flex-grow:0;  
}

/\* Same at a Scene level \*/  
/\* \*/  
#kn-scene\_352 table.kn-table-table {  
width: unset;  
}  
/\* Report (e.g. Pivot Table) \*/  
#kn-scene\_352 .kn-report-row .column {  
flex-grow:0;  
}

/\* Application wide needs use of !important \*/  
/\* \*/  
/\* Table \*/  
table.kn-table-table {  
width: unset;  
}  
/\* Report (e.g. Pivot Table) \*/  
.kn-report-row .column {  
flex-grow:0!important;  
}

---

<div class="post-metadata">

**Author:** ![DeanBozzan62116](https://avatars.discourse-cdn.com/v4/letter/d/ad7895/32.png) [@DeanBozzan62116](https://forums.knack.com/u/DeanBozzan62116)\
**Post date:** [February 26, 2021, 12:55am UTC](https://forums.knack.com/t/css-to-change-table-width/8713/3 "2021-02-26T00:55:53Z")

</div>

![](upload://r7XnqCbD7EhmverQbP4s4GkuXb6.jpeg)

---

<div class="post-metadata">

**Author:** ![DeanBozzan62116](https://avatars.discourse-cdn.com/v4/letter/d/ad7895/32.png) [@DeanBozzan62116](https://forums.knack.com/u/DeanBozzan62116)\
**Post date:** [February 26, 2021, 12:52am UTC](https://forums.knack.com/t/css-to-change-table-width/8713/4 "2021-02-26T00:52:48Z")

</div>

I will throw some more in here as you start making changes you may want to center more items in the page:

/\* Center Tables and set to 80% page width \*/

.kn-contenttable{

width:80%;

margin-left:auto;

margin-right:auto;

}
  

/\* Center Menus \*/

.control {

position:relative;

text-align:center;

}
  

/\* Center headers \*/

h1, h2, h3, h4, h5, h6 {

text-align:center;

}