我创建了一个非常简单的dash应用程序,但是我不能让主div扩展到整个页面的高度.
以下是python代码
import dash
from dash import html
app = dash.Dash(__name__)
page = html.Div(id='page',
children=[html.H1('hello')],
style={'background-color': 'orange', 'height': '100%', 'width': '100%'},
className='flex-grow-1')
app.layout = html.Div(
page,
className='full-screen-div'
)
app.run_server()
下面是低于assets/custom.css
的css代码
body, html {
height: 100%;
width: 100%;
margin: 0;
}
.full-screen-div {
width: 100vw;
height: 100%;
min-height: 100%;
box-sizing: border-box;
overflow-x: hidden;
overflow-y: hidden;
}
The page looks as shown below - I would like the orange background to stretch to fill the browser window.
I have tried setting height with the viewport height parameter, but that doesn't translate well between screen sizes. I have also tried setting position: fixed
, but that gives some overflow when introducing figures.