Join the Webstudio community

Updated 3 months ago

How to Center a Div lol

At a glance

What's the easiest way to center a box? In webflow it has that grid that you select to alight left, right and center and it sets the margin to auto for you or something. What's the equivalent in webstudio?

16 comments

BBogdan

do this only parent

Attachment

LLuke AKA Shoot Your Bricks

Thanks. Would be nice if I didn't have to create a parent though. I don't think webflow required it

BBogdan

You can set margin to auto here too. It is not unique to webflow

BBogdan

Though you still need a parent to be grid or flex

BBogdan

Otherwise it will center only horizontally

BBogdan

In webflow as well

LLuke AKA Shoot Your Bricks

Hmm ok. That makes sense. It just seems like it was easier in webflow. Let me check webflow to see if I am remembering correctly

LLuke AKA Shoot Your Bricks

Here's what I'm talking about. It's probably working the same under the hood, but you don't have to add a parent or anything. Just click the center button and it does it's thing.

LLuke AKA Shoot Your Bricks

Really I should put this in #︳suggestions at this point lol

BBogdan

So you need to center only horizontally? Just set margin left and right to auto. Shortcut is nice but it really just sets 2 values.

LLuke AKA Shoot Your Bricks

Oh, right

LLuke AKA Shoot Your Bricks

I guess the center shortcut isn't exactly necessary, but typing in "auto" isn't very intuitive.

LLuke AKA Shoot Your Bricks

Perhaps "auto" should be added to the units dropdown? That might be confusing too though...

OOleg Isonen

thats just margin left and right auto

OOleg Isonen

it should actually be like with the width

Attachment

OOleg Isonen

@TrySound seems like a bug that we don't have auto and othersin the autocomplete in spacing

Add a reply