Column width in financial table

#1

I am running a model for 12 months and displaying the results in a financial table. The columns are crowded. Is there some way to adjust it?

image
image.png756×333 6.84 KB

#2

Hi Bruce!

You can use CSS to adjust this. Add this inside the <head> section in your index.html file

<style>
    table.table tr th, table.table tr td {
        width:75px;
    }
</style>

There’s many other CSS stylings you can do on tables. See this link for some examples.

WILL

#3

Thanks Will. Is there any way to freeze the left colmn when I do this? When I scroll to the right, it scrolls over the titles in the left column.

#4

Hi Bruce,

I found a suggestion here that seems to work

I added this code inside the <style> and that made the left columns stay in one place while the rest of the table scrolled horizontally.

.f-financial-table {
  overflow-x: auto;
}

table.table tr>th:first-child,table.table tr>td:first-child {
  position: sticky;
  left: 0;
}

table.table tr th {
    background-color: #F9F9F9;
}