Studio

Learn how to set a box's size and explore the different size units available. Choosing the right unit helps you create responsive, easy-to-maintain layouts.

Box Layout: Size (Width & Height)

Learn how to set spacing on boxes in Studio.Design. Understand the differences between margin, padding, and gap, and how to configure each one.

Box Layout: Margin, Padding, and Gap (Spacing)

In Studio.Design, pages are built by stacking boxes. Adjust box layout by setting the direction on the parent box and the alignment of child boxes. Select a parent box to…

Box Layout: Direction and Alignment

Box position settings let you control placement (relative, fixed, absolute, sticky), stacking order, and overflow behavior. Access these from the Box tab on the right side of the design editor.

Box Position: Placement, Stacking Order & Overflow

Learn about the four position types for boxes — Relative, Fixed, Absolute, and Sticky — and how to configure each one in Studio.Design.

Box Position: Placement (Relative, Fixed, Absolute, Sticky)

Overflow settings control how child boxes that extend beyond a parent box are displayed. Choose from three options: Visible, Hidden, or Scroll.

Box Position: Overflow Settings

Set a negative value for a box's margin to reduce spacing and create overlapping layouts. Since this uses margin (outer spacing), you can combine it with other spacing settings for…

Overlapping Boxes (Negative Margin)

To make side-by-side boxes the same height, group them together and apply the "Stretch" setting to the parent box.

Match the height of multiple boxes

To pin a box to the edge of the screen, specify the distance between the nearest side of the box and the edge of the screen.

Pin a box to the edge of the screen

Apply transformations like move, rotate, scale, and skew to any box. Use transform handles to visually adjust transformations right on the screen.

Transform: Move, Rotate, Scale & Skew

Learn how to configure box layout and position settings. These operations are performed in the Box tab of the right panel.

Box Layout and Position

Studio.Design

Studio.Blog

Studio.Showcase

What's New

Updates

Official Site

Blog

Case Study

Find answers and get help from Intercom Support and Community Experts

Conversations you've started through the messenger will appear here.

No conversations created by you

Try using different keywords or checking for typos.

No conversations found

Title

This site employs cookies and other technologies that we and our third party vendors use to monitor and record personal information about you and your interactions with the site (including content viewed, cursor movements, screen recordings, and chat contents) for the purposes described in our Cookie Policy. By continuing to visit our site, you agree to our {websiteTermsLink}, {privacyPolicyLink} and {cookiePolicyLink}.

This site uses cookies and similar technologies ("cookies") as strictly necessary for site operation. We and our partners also would like to set additional cookies to enable site performance analytics, functionality, advertising and social media features. See our {cookiePolicyLink} for details. You can change your cookie preferences in our Cookie Settings.

We use cookies to make our site work and also for analytics and advertising purposes. You can enable or disable optional cookies as desired. See our {cookiePolicyLink} for more details.

Advertising cookies are set by our advertising partners to collect information about your use of the site, our communications, and other online services over time and with different browsers and devices. They use this information to show you ads online that they think will interest you and measure the ads' performance. Social media cookies are set by social media platforms to enable you to share content on those platforms, and are capable of tracking information about your activity across other online services for use as described in their privacy policies.

These cookies enable the website to provide enhanced functionality and personalisation. They may be set by us or by third party providers whose services we have added to our pages. If you do not allow these cookies then some or all of these services may not function properly.

These cookies are necessary for the website to function and cannot be switched off in our systems.

These cookies allow us to count visits and traffic sources so we can measure and improve the performance of our site. They help us to know which pages are the most and least popular and see how visitors move around the site.

You have the right to opt out of the sale of your personal information. See our {cookiePolicyLink} for more details about how we use your data.

Your Privacy Choices

We use cookies to enhance your experience. You can customize your cookie preferences below. See our {cookiePolicyLink} for more details.

Cookie Settings

Empty Help Center

Uh oh. That page doesn’t exist.

Home

Search results

Disappointed

Neutral

Smiley

Thinking...

Searching through sources...

Analyzing...

Tickets submitted through the messenger or by a support agent in your conversation will appear here.