The md-mode="fixed" is not working if i want a full height page to be scrollable but keeping the toolbar fixed.
Someone have achieved this? Thanks!
<template>
<div id="app" class="page-container">
<md-app md-mode="fixed">
<md-app-toolbar class="md-primary">
<span class="md-title">My Title</span>
</md-app-toolbar>
<md-app-content>
<router-view></router-view>
</md-app-content>
</md-app>
</div>
</template>
<style lang="scss" scoped>
</style>
<script>
export default {
name: 'app'
}
</script>
You could add class or style on it.
If you want it with a 100% viewport height, try:
<template>
<md-app class="full-height" md-mode="fixed">
</md-app>
</template>
<style lang="scss" scoped>
.full-height {
height: 100vh;
}
</style>
@VdustR, I tried this before, seeing exactly the #1256, but the toolbar is scrolling, like in the image attached.

Remove root div that you have in your code.
@Samuell1, tried this right now and does not work BUT it worked now when i tried this below.
Thanks so much and nice work with this awesome project! : )
max-height: 100vh;
<template>
<div id="app" class="page-container">
<md-app md-mode="fixed">
<md-app-toolbar class="md-primary">
<span class="md-title">My Title</span>
</md-app-toolbar>
<md-app-content>
<router-view></router-view>
</md-app-content>
</md-app>
</div>
</template>
<script>
export default {
name: 'app'
}
</script>
<style lang="scss" scoped>
.md-app {
max-height: 100vh;
}
</style>
Most helpful comment
@Samuell1, tried this right now and does not work BUT it worked now when i tried this below.
Thanks so much and nice work with this awesome project! : )
max-height: 100vh;