stepper 在 scroll-area 中显示问题

stepper 中显示节点内容过多导致换行,想把它装在 scroll-area 中显示。有大佬知道怎么设置 css 属性吗

像下面这样写,scroll-area 无法显示。如果我在 scroll-area 中添加一个 input 控件,则可以显示,但是滚动区域特别小。有大神知道怎么操作吗

        <q-card class="col-md-12 row" >
          <q-item class="col-md-12 row">
          <q-card-section>
          <div class="text-h6">Process Flow</div>
        </q-card-section>
      </q-item>
      <q-item>
        <q-item-section>
      <q-scroll-area style="height: 72px; max-width:2000px;">
      <div class="row no-wrap">
        <div  style="width: 1000px" class="q-pa-sm">

        <q-stepper
      v-model="submitData.ProcessStep"
      ref="stepper"
      :active-color="activeColor"
      :active-icon="activeIcon"
    >
      <q-step
        :name="0"
        prefix="0"
        :done="submitData.ProcessStep > 0"
        title="Submit"
      >
      </q-step>
    </q-stepper>
  </div>
      </div>
    </q-scroll-area>
  </q-item-section>
  </q-item>
        </q-card>