quasar: QSelect menu gets cut off if using it within an overflow hidden parent

Software version

Quasar v1 beta1

JsFiddle

What did you get as the error?

The popover is hidden because it is contained within the QDialog viewbox. The popover seems to be scrollable in this case, but that also does not work like it should (can’t scroll up).

What were you expecting?

It should be visible, probably by not containing the popover inside the QDialog.

What steps did you take, to get the error?

About this issue

Original URL
State: closed
Created 5 years ago
Reactions: 4
Comments: 26 (11 by maintainers)

Commits related to this issue

feat(quasar): Refactor QSelect to use QMenu close #3723, close #3358, close #3242, close #3276 — committed to pdanpdan/quasar by pdanpdan 5 years ago
feat(quasar): Refactor QSelect to use QMenu close #3723, close #3358, close #3242, close #3276 — committed to pdanpdan/quasar by pdanpdan 5 years ago
feat(quasar): Refactor QSelect to use QMenu close #3723, close #3358, close #3242, close #3276 — committed to pdanpdan/quasar by pdanpdan 5 years ago
feat(quasar): Refactor QSelect to use QMenu close #3723, close #3358, close #3242, close #3276 — committed to pdanpdan/quasar by pdanpdan 5 years ago
feat(quasar): Refactor QSelect to use QMenu close #3723, close #3358, close #3242, close #3276 — committed to pdanpdan/quasar by pdanpdan 5 years ago
feat(quasar): Refactor QSelect to use QMenu close #3723, close #3358, close #3242, close #3276 — committed to pdanpdan/quasar by pdanpdan 5 years ago
feat(quasar): Refactor QSelect to use QMenu close #3723, close #3358, close #3242, close #3276 — committed to pdanpdan/quasar by pdanpdan 5 years ago
feat(quasar): Refactor QSelect to use QMenu close #3723, close #3358, close #3242, close #3276 — committed to pdanpdan/quasar by pdanpdan 5 years ago
feat(quasar): Refactor QSelect to use QMenu close #3723, close #3358, close #3242, close #3276 — committed to pdanpdan/quasar by pdanpdan 5 years ago
feat(quasar): Refactor QSelect to use QMenu close #3723, close #3358, close #3242, close #3276 — committed to pdanpdan/quasar by pdanpdan 5 years ago
feat(quasar): Refactor QSelect to use QMenu close #3723, close #3358, close #3242, close #3276 — committed to pdanpdan/quasar by pdanpdan 5 years ago
feat(quasar): Refactor QSelect to use QMenu close #3723, close #3358, close #3242, close #3276 — committed to pdanpdan/quasar by pdanpdan 5 years ago
feat(quasar): Refactor QSelect to use QMenu close #3723, close #3358, close #3242, close #3276 — committed to pdanpdan/quasar by pdanpdan 5 years ago
feat(quasar): Refactor QSelect to use QMenu close #3723, close #3358, close #3242, close #3276 — committed to pdanpdan/quasar by pdanpdan 5 years ago
feat(quasar): Refactor QSelect to use QMenu close #3723, close #3358, close #3242, close #3276 — committed to pdanpdan/quasar by pdanpdan 5 years ago
feat(quasar): Refactor QSelect to use QMenu close #3723, close #3358, close #3242, close #3276 — committed to pdanpdan/quasar by pdanpdan 5 years ago
feat(quasar): Refactor QSelect to use QMenu close #3723, close #3358, close #3242, close #3276 — committed to pdanpdan/quasar by pdanpdan 5 years ago
feat(quasar): Refactor QSelect to use QMenu close #3723, close #3358, close #3242, close #3276 — committed to pdanpdan/quasar by pdanpdan 5 years ago
feat(quasar): Refactor QSelect to use QMenu (#3729) close #3723, close #3358, close #3242, close #3276 — committed to quasarframework/quasar by pdanpdan 5 years ago

Most upvoted comments

We are aware and we will fix it.

+10

rstoenescu on Mar 7, 2019

This is on the radar, yes.

rstoenescu on Feb 21, 2019

Fix will be available in beta.14

rstoenescu on Mar 29, 2019

I have the same issue. For temporary fix, I added the following css:

.q-dialog {
    .q-dialog__inner > div {
        overflow: visible;
    }
}

topeysoft on Mar 4, 2019

The same with q-tab-panels, q-tabs and q-card (quasar@1.0.0-beta.4)

https://codepen.io/diegomagikal/pen/daBPoj

The same with QTable (opening a QSelect changes de height of the table… maybe the popup container should be something else)

https://codepen.io/anon/pen/bZqxwv?editors=1010

lucasfernog on Mar 7, 2019

@kimini507 Already reported. Already fixed. Will be available in beta.17 (to be released today or tomorrow).

rstoenescu on Apr 15, 2019

Fix available in beta.16.

rstoenescu on Apr 10, 2019

Delaying this a bit. Not yet “production ready”. Didn’t went into beta.14.

rstoenescu on Mar 31, 2019

The same with q-tab-panels, q-tabs and q-card (quasar@1.0.0-beta.4)

https://codepen.io/diegomagikal/pen/daBPoj

diegomagikal on Feb 22, 2019

Same goes to q-expansion-item

labs20 on Feb 15, 2019