Pandas tables not wrapping properly

[vtoliveira]

This is one of my first issues, I hope I am doing it right.

I tried to use mknotebooks to render a notebook, but all my pandas tables with a few extra columns are not wrapped properly. This is a print of screen:

I am not sure it this is a bug, or something that I am doing wrong, so I will label it as a question.

[LeonardAukea]

Adding this to css helps:

table {
    display: block;
    max-width: -moz-fit-content;
    max-width: fit-content;
    margin: 0 auto;
    overflow-x: auto;
    white-space: nowrap;
  }

[timvink]

Thanks @LeonardAukea, this helped me out.

@greenape Should this CSS be included with mknotebooks by default? would you like a PR?

[greenape]

Sounds like it - pr very welcome 🙂

[LeonardAukea]

I'll provide the PR tomorrow.

[timvink]

Oh I meant to offer a PR, but bit pressed for time so it was on my backlog. Thanks @LeonardAukea :)

Might be to good to add an extra selector to the CSS so it only applies to ipynb pages, so there are no side-effects with other plugins. Also possible is to provide the PR with max-width to mkdocs-material -- solving the issue as the source.

[LeonardAukea]

@timvink feel free to do it if you want 😄. I'm a bit busy anyways.

I would love for this plugin to be functional with interactive plots :)

[Harsh-Maheshwari]

This issue still seems to be in play. Where and what do i need to add for dataframes to be displayed better

table {
    display: block;
    max-width: -moz-fit-content;
    max-width: fit-content;
    margin: 0 auto;
    overflow-x: auto;
    white-space: nowrap;
  }

[timvink]

This is CSS (cascading style sheets), put it in a file with a .css extension and add it to your theme from your mkdocs.yml file using the extra_css config options: https://www.mkdocs.org/user-guide/configuration/#extra_css

[nathnx]

@Harsh-Maheshwari I've copied pandas-data frame.css to my project as an extra css file and added the table class to the it.