For bar charts, widths of 'row chart-container' are 20px larger than that of slice cell's

Make sure these boxes are checked before submitting your issue - thank you!

• I have checked the superset logs for python stacktraces and included it here as text if any
• I have reproduced the issue with at least the latest released version of superset
• I have checked the issue tracker for the same issue and I haven’t found one similar

Superset version

0.18.5

Expected results

Like other graphs, these two components have the same size and scrolling bar shouldn’t be necessary in the usual cases.

Actual results

As shown by the pictures, because of the difference in size, unnecessary scroll bars are required and annoy users. On an other kinds of visualization types, as long as the box is big enough, the two widths for these two components are all equal.

Steps to reproduce

Create any kind of bar chart (distribution or time series) and inspect web page elements with developer’s tools.

Edit

I’ve spent the entire morning inspecting this peculiar bug, but have no idea how row chart-container’s width is set. row chart-container is created by SliceCell in SliceCell.jsx as a normal html tag, not specifying its width, so I guess its width is set automatically, but I’ve no idea why bar and dist_bar are the only special ones. I checked ndv3_vis.js and indeed these two bars are “special” since they call the function barchartWidth to set their widths, but after some manipulations on that function I diagonalize that this does not cause the bug.

[luciuschina]

@xrmx Add below code in CSS templates can remove the scrollbars: .row{ margin-right:0px; }

[omaraboumrad]

It’s quite annoying to have scrollbars where they’re not needed. I’ve temporarily resolved the unneeded vertical scrollbar by adding the following to the Dashboard CSS:

.dashboard-component-chart-holder {
    height: auto;
}

I do not know the side effects of doing so.