pandasjupyter-notebook

Jupyter notebook display two pandas tables side by side


I have two pandas dataframes and I would like to display them in Jupyter notebook.

Doing something like:

display(df1)
display(df2)

Shows them one below another:

enter image description here

I would like to have a second dataframe on the right of the first one. There is a similar question, but it looks like there a person is satisfied either with merging them in one dataframe of showing the difference between them.

This will not work for me. In my case dataframes can represent completely different (non-comparable elements) and the size of them can be different. Thus my main goal is to save space.


Solution

  • You could override the CSS of the output code. It uses flex-direction: column by default. Try changing it to row instead. Here's an example:

    import pandas as pd
    import numpy as np
    from IPython.display import display, HTML
    
    CSS = """
    .output {
        flex-direction: row;
    }
    """
    
    HTML('<style>{}</style>'.format(CSS))
    

    Jupyter image

    You could, of course, customize the CSS further as you wish.

    If you wish to target only one cell's output, try using the :nth-child() selector. For example, this code will modify the CSS of the output of only the 5th cell in the notebook:

    CSS = """
    div.cell:nth-child(5) .output {
        flex-direction: row;
    }
    """