Center in a container

Hi, I noticed that it was still difficult to simply center an item that you place in a container (image, video, paragraph, …). It is always aligned to the left and you have to play with the padding. Could we imagine a WYSIWYG world in which when we indicate the alignment in the container is “center” then the item placed in the container ends up in the center? I encounter this problem under RW/Stacks, I would have really loved to no longer see it with Elements. :pray:

echo some of that, may not be possible in all cases but I am now dropping a single flex into the container or section and centring using the flex. not sure how my issue of not being able to see different elements one you start dropping text / images into a container / section and having to revert to using the tree rather than wysiwyg, I have adjusted to that, but as I said before new users may find this frustrating for wysiwyg. But that said I am finding it straight forward and think this will be a powerful app, :grinning:

Ok with what you said but we’re in 21st century so center would be easy in a hurry. :face_with_hand_over_mouth:

I’ve just spent 20 minutes trying to work out how to do this - I clearly should have read all the beta feedback before starting.
A simple way to centre a container seems like something which should exist.
Needing a container, flex box, flex item and image seems overkill to simply centre an image on a page.
Of course I may just be doing something totally wrong - it’s a long time since I’ve had to learn a new app from scratch.

Yeah @trinube, technically you can do this in Tailwind with just a container and an image (see below), but Elements seems to be pushing nesting unnecessary containers — which will become a nightmare to manage as pages get more complex, especially with drag and drop — making the node/structure view an essential tool rather than an optional one.

<div class="flex items-center justify-center h-screen">
  <img src="i-am-a-centered.png" />
</div>

One thing I’m finding is that the mental model in Elements is currently more developer oriented than user oriented. Yes, flex boxes are wonderful, and it’s great to use examples that will help users learn more about how the web works, but at the end of the day much of the technical details aren’t really necessary in Elements.

My opinion is that creating pages/a site in Elements should be as easy, and enjoyable as creating a page/newsletter in Apple Pages. And unlike Apple Pages, if I need to go a little deeper and feel like writing a little code in Elements I can, but you shouldn’t need to know how HTML and CSS works (or rtf, docx, epub or PostScript in the case of Pages) just to create something wonderful.

This very topic is a good focus point for when do we cross the line for simple versus features, or better yet, what defines simple.

Do we add a bunch of functionality to every container? Retaining all functionality is what is expected in a coding. Or,

Do we require certain containers for certain tasks. Sacrifice functionality for “ease of use” from a non-coders viewpoint.

If it’s me, YES! This is spot on.

1 Like

I think that presenting the user with too many container options to choose from will cause more confusion than having one flexible (block, flex, grid) container that can easily be configured as they wish.

We are on the same page, I simply presented this as a contrast of options. There may even be more options. This piggybacks off this thread.

1 Like