I have problem with horizontal scrolling, when slide-wrap width is smaller than parent width, then is inside q-page, but when I set width i.e. to 100% it is wider than parent. How to adjust width of menu to have horizontal scroll inside parent width to not set hardcoded widt value?

<template>
  <q-layout>
    <q-page-container class="column col row" style="background-color: rgb(217,225,238);">
      <q-page>
        <div class="col row column">
          <div class="slide">
            <menu-bar class=""></menu-bar>
          </div>
        </div>
      </q-page>
    </q-page-container>
  </q-layout>
</template>

<style lang="scss" scoped>
.slide-wrap {
  width: 350px;
  overflow-x: scroll;
}

.slide {
  width: 900px;
}

</style>