# Step Container ## Setup **Attribute:** `sf-step = stepName` **Where:** any `div` element that you want as a ***step** (is required for single-step forms too).* **Description:** Defines the form's steps and assigns each step a unique name. Allows for navigation between steps. **HTML Example** 
<div sf="myForm">
  <form>
    <!-- Step 1 -->
    <div sf-step="step1">
      <!-- Step 1 content goes here -->
    </div>

    <!-- ## OPTIONAL ## -->
    <!-- Step 2 -->
    <div sf-step="step2">
      <!-- Step 2 content goes here -->
    </div>
  </form>
</div>
**Webflow Example**
{% embed url="" %} VIDEO: Adding names to steps is highly suggested. This way Superform and you can navigate to each step easier. {% endembed %} {% hint style="info" %} **Dos and Dont's** *** Step names are used to control navigation and can be referenced programmatically or via navigation attributes, enhancing form flow and user experience. \ **Avoid using only numbers in step names or start with a number!** **Do** ✅ * step-1 * step2 * step-intro * last **Don't** ❌ * 4 * 3a *** Use names semantically so other developers can understand your way of thinking. {% endhint %}