No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    Make QSplitter take all the remaining available space

    Framework
    1
    2
    316
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • T
      tdumitr last edited by

      I am working on an app that has a main layout with a QHeader containing a QToolbar, a QDrawer and a QFooter. In this layout, I have the need for a page that has a QToolbar at the top of the page and a QSplitter that takes the remainder of the available space and no more than that. I have tried to extend it, but I cannot make the QSplitter to take exactly the available space (I did make it to extend to the bottom, but it was taller than the available space by the height of the QToolbar).

      Please help ! I have a jsfiddle to illustrate the problem. I made the splitter’s separator color red, and you can see that it is just long enough to cover the content of the splitter and the margins. What I want is to extend it all the way to the footer and no farther than that (no scroll bars).

      1 Reply Last reply Reply Quote 0
      • T
        tdumitr last edited by

        Never mind, I figured it out. I added style="flex: 1 1 auto; on the QSplitter and it did fill all the available space.

        1 Reply Last reply Reply Quote 1
        • First post
          Last post