Bounding box

Bounding box

A bounding box is a rectangular border around a website element (e.g., a heading, paragraph, or image) that appears during the design process. These boxes usually have contact points at every corner and in the center of each side to let designers manipulate elements’ sizes and shapes more precisely.

In web design, we call using bounding boxes, or putting every element in its own box, the box model. The boxes can overlap or interact as you change their size and shape, depending on the element type. If you’re manipulating elements that can’t overlap, increasing the width of one box might push the box next to it down or to the side to make space. 

Webflow automatically creates a bounding box when you introduce a new element. You can then manipulate the box's borders, size, and spacing to create the effect you want in your design.

Other glossary terms

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Hmm…we couldn’t find any results. Try a different search term or reset the filter.
Reset the filter
Load more