Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Bootstrap 5 with fill layout: page refresh introduces scrollbar #411

Closed
rickhelmus opened this issue Jan 3, 2023 · 0 comments · Fixed by #418
Closed

Bootstrap 5 with fill layout: page refresh introduces scrollbar #411

rickhelmus opened this issue Jan 3, 2023 · 0 comments · Fixed by #418

Comments

@rickhelmus
Copy link

Hello,

With the MWE below and with the second tab active, a page refresh causes a vertical scrollbar to appear that can be used to scroll back to the first tab. Furthermore, the tab selection on the navbar revers to tab 1 while tab 2 is still active. Downgrading bootstrap isn't an option since I am using cards from bslib.

---
title: "Themed dashboard"
output: 
    flexdashboard::flex_dashboard:
        theme:
            version: 5
    orientation: columns
    vertical_layout: fill
---

```{r setup, include=FALSE}
library(flexdashboard)
```

Tab 1
==========

Column {data-width=650 .tabset}
-----------------------------------------------------------------------

### Chart A

### Chart B

Tab 2
==========

Column {data-width=350}
-----------------------------------------------------------------------

### Chart C

### Chart D

A partial solution is with

html, body {
    overflow: hidden;
}

But this will of course not fix the navbar tab selection.

Thanks,
Rick

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant