How to control the dash_table height and bottom margin

Dash Python
1

Hey! So I am playing around with dash table and having quite a hard time with it.
I have 3 questions an answer to any of them would be great!

First: I want my dash table to fit into my div and have a margin from the container div. The problem is that the bottom margin doesn’t seem to work

table height
table height913×363 10.2 KB

The data table code:

import dash_table

def createDataTable(tableId, df):
    return dash_table.DataTable(
        id=tableId,
        columns=[{"name": i, "id": i} for i in df.columns],
        data=df.to_dict('records'),
        page_action='none',
        fixed_rows={'headers': True},
        style_cell={
            "color": "#fff",
            "background-color": "#1d1f26",
            'text-align':'center'
        },
        style_table={
            "height": "50vh",
            "overflowX": "auto",
            "overflowY": "auto",
            "color": "#fff",
            "background-color": "#1d1f26",
        },
        style_data={},
        virtualization=True,
    )

The div container code:

html.Div(
                id="table",
                children=[
                    createDataTable("dataTable", getdf())
                ],
                style={
                    "flex": 1,
                    "background-color": "#1d1f26",
                    "margin-top": "1em",
                    "border-radius": "25px",
                    "overflow":"hidden",
                }
            ),

How can I make it so it will take only the space available and make the margin-bottom work?

Second question: let’s say I got my answer for the first question how can I make sure it only shows a full row and not half a row of the table at the bottom?

Third question: How can I give the column headers more margin from the border?

Thanks to anyone reading this!