2

I have a tall dashboard (multiple screens' worth, with a scrollbar) in Apache Superset 2.0.0. I have a native filter pane on the left side with the filters up top and then the "APPLY FILTERS" and "CLEAR ALL" buttons at the bottom on the screen. When viewed directly in Superset, it looks great: those buttons stay in place as I scroll.

However, when I embed this dashboard via an iframe, the filter action buttons appear all the way at the bottom of my tall dashboard. In my case there's a full screen of whitespace between the filter inputs and the buttons so you can't see them both at once. It's confusing for the user.

How can I force the buttons to be anchored directly below the last filter?

1 Answer 1

2

Edit Dashboard -> Edit CSS and add this:

.open > div:nth-child(3) {
  
  position: absolute;
  top: 300px;
}

Adjust the 300px as needed to hard-code it further up or down. If you have multiple-choice filter(s), select all options when calibrating your pixel value to ensure that you've provided sufficient space.

The filter buttons are the direct 3rd child of an open class div, the > makes it direct-only so that a third filter (if you have one) is not also moved to this position.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.