How to change height of Q-Layout having Q-toolbar and Q-tabs



  • Hi,

    I am new in quasar and got stuck in below issue.
    I am making Header component for my UI. I have used QLayout component as my main component and inside that i have used q-toolbar and q-tabs as suggested in documentation to make my header looks cool.

    The height of my quasar layout looks too big. How can i reduce the height of my layout?

    I have attached the screenshot as well.

    In my UI q-tabs are not responsive. When i am reducing the size of chrome window, They are getting suppressed. I want to align then 1 below other. Can i do that with quasar components?

    Thanks,
    Jayesh!!



  • You should be able to adjust it in your components style:

    <style>
    .q-layout-header {height: 1px}
    // OR
    .q-layout {height: 1px}
    </style>
    

    The screenshot did not post, so not sure if this fully answers your question, but hopefully it 's a start…