# Resizing

<figure><img src="https://content.gitbook.com/content/cNWVdvjm9hCdZlvVho49/blobs/WV2t2sdUqOCUBQKxbpVo/image.png" alt=""><figcaption></figcaption></figure>

When you hover over a **section** or **component**, **purple bars** appear:

* Drag these bars to **dynamically resize** your elements (Bootstrap grid).
* Widths range from **1 to 12**, corresponding to a 12-column scale (equivalent to 100%).

**Example:**

* 12/12 = 100%
* 6/12 = 50%
* 4/12 = \~33%

This allows you to create a **responsive** site very easily.
