What is causing that white border right after the outermost outline?

  border, css, html, plotly-dash, python

got something that is driving me crazy here, please help me!

I’ve coded some website layout test with Dash in Python and here is code:

app = dash.Dash()

    app.layout = html.Div([
                           html.H2(children="Title",
                           style={'color':'lightgrey',
                                  'background-color': 'black',
                                  'margin-top': '0px',
                                  'margin-bottom': '0px',
                                  'padding-top':'12.5px',
                                  'padding-bottom':'12.5px',
                                  'padding-left':'10px',
                                  'text-align': 'center'}),
                          
                           html.Div(children=[],
    
                                    style={'widh':'50%', 
                                           'height':'50%',
                                           'border': '10px solid rgb(190, 190, 190)',
                                           'outline': '10px solid rgb(200, 255, 255)',
                                           'margin': '10px 10px 0px 10px',
                                           'padding':'0px 0px 0px 0px',
                                           'background-color': 'green',
                                           'background-size': 'auto'} )],
    
    style = {'widh':'100vw', 
             'height':'100vh',
             'border': '10px solid rgb(255, 255, 255)',
             'outline': '10px solid rgb(200, 200, 255)',
             'outline-offset': '0px',
             'margin': '0px 0px 0px 0px',
             'padding':'0px 0px 0px 0px',
             'background-color': 'lightblue',
             'background-size': 'auto'} 
    )
    
    if __name__ == '__main__':
        app.run_server(debug = True)

This gives me this layout (don’t care about colors, its just structure test ^^):
Coded layout result image

I have two questions about this:

The main one is: Why is that white border there?
The second is: What is causing the size os the page to have some extra space at the bottom? (See the reference below:)

Second question image

Source: Python Questions

LEAVE A COMMENT