JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vuetify.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/vuetify.min.css">
<div id="app">
  <v-app>
    <p>Some Content</p>
    <v-stepper class="stepper">
      <v-stepper-header class="white sticky">
        <v-stepper-step step="1">Name of step 1</v-stepper-step>
        <v-divider></v-divider>
        <v-stepper-step step="2">Name of step 2</v-stepper-step>
        <v-divider></v-divider>
        <v-stepper-step step="3">Name of step 3</v-stepper-step>
      </v-stepper-header>
      <v-stepper-items>
        <v-stepper-content step="1">
          <v-card class="mb-6" color="grey lighten-1" height="1000px"></v-card>
          <v-btn color="primary">Continue</v-btn>
          <v-btn text>Cancel</v-btn>
        </v-stepper-content>
        <v-stepper-content step="2">
          <v-card class="mb-6" color="grey lighten-1" height="1000px"></v-card>
          <v-btn color="primary">Continue</v-btn>
          <v-btn text>Cancel</v-btn>
        </v-stepper-content>
        <v-stepper-content step="3">
          <v-card class="mb-6" color="grey lighten-1" height="1000px"></v-card>
          <v-btn color="primary">Continue</v-btn>
          <v-btn text>Cancel</v-btn>
        </v-stepper-content>
      </v-stepper-items>
    </v-stepper>
  </v-app>
</div>

CSS

.stepper {
  overflow: visible;
}

.sticky {
  position: sticky;
  top: 0;
  z-index: 1;
}

JavaScript

new Vue({
  vuetify: new Vuetify()
}).$mount('#app')