dash-bootstrap-components: Container width is wrong

Please refer to #286. The size of dbc.Container with the 4 colored rectangles measures as 1110x937 (my screen is 1920x1080 and of course some real estate is consumed by the browser). I expected the colored cells to occupy the entire view. Changing the browser window only alters the very wide margins on right and left. Using Chrome browser 81.0.4044.138 or Edge browser.

  • dash version: #1.12.0
  • dash-bootstrap-components version: #0.10.0
  • components affected by bug: dbc.Container

What is happening?

See above. I have tried various Container settings to affect width, to no avail.

What should be happening?

The colored cells should fill the browser view, shouldn’t they? If I change dbc.Container to html.Div, then the colored cells do fill the window. But one problem remains: the window is not completely displayed - it can be scrolled vertically and horizontally by a small amount. The small amount appears to be approximately the width (or height) of a scrollbar.

Code

See program in #286. I have not changed it, except to try using html.Div in place of dbc.Container.

About this issue

  • Original URL
  • State: closed
  • Created 4 years ago
  • Comments: 15

Most upvoted comments

Apparently dash-bootstrap-components is doing what it promises, but dash-core-components behaves poorly when dcc.Graph is constrained as when I put dcc.Graph inside a dbc cell with "div class=‘h-25’ ". So I’ll return to Dash/Plotly forums and see if I can get this resolved, Thank you all for your help here - so much better than Dash community.