Layout

Stybber offers a simple, responsive grid system and layout utilities to help you build flexible, modern web pages.

Container

Use the .container class to center your content and add horizontal padding:

<div class="container">
  <!-- Your content here -->
</div>

Grid System

Create responsive layouts with .row and .col classes:

<div class="container">
  <div class="row">
    <div class="col-6">50% width column</div>
    <div class="col-6">50% width column</div>
  </div>
</div>

Spacing Utilities

Quickly add margin and padding with classes like:

• .m-2 — margin
• .p-3 — padding
• .mt-4 — margin-top
• .px-1 — horizontal padding

Alignment Helpers

Center text or elements with:

• text-center
• text-left
• text-right

Responsive Design

Use media queries and responsive classes to make your layout adapt to all devices easily.