Opened 6 months ago
Last modified 4 months ago
#61473 new feature request
Feature to set Absolute & Relative position of Blocks in Gutenberg Editor
Reported by: | posimyththemes | Owned by: | |
---|---|---|---|
Milestone: | Awaiting Review | Priority: | normal |
Severity: | normal | Version: | |
Component: | Editor | Keywords: | |
Focuses: | Cc: |
Description
It would be very helpful for us if there is an option in the Gutenberg Editor to set Absolute & Relative Position of Blocks. Currently we only have support setting position to sticky, but in some cases that’s not enough. Like for an Example if we want to build a Notification Badge (1) in top-right corner in some Stack/Row, there is no Absolute/Relative positioning available in Gutenberg Editor. For such cases if there is an option available to position any Block anywhere in absolute/relative position it will be really helpful.
Attachments (1)
Change History (4)
#2
@
4 months ago
As suggested in GB21539, positioning blocks can be tricky. It's also somewhat at odds with the block system, as it can have undesired effects when editing, like being positioned on top of toolbars and other editor items.
Would a different approach work for this? For instance, using the Grid block, adding a Group block to a cell and making it sticky; or allowing custom CSS per block instance as suggested in GB56127.
#3
@
4 months ago
Hi @priethor
Having Absolute Positioning for Gutenberg Core Blocks would make a great difference, as small but necessary portions of many designs need Absolute Positioning, But if that causes too many troubles for the Editor & the overall Experience, we think that the Custom CSS will also help, as we can use that to add position CSS property for a particular Instance of a Block.
The screenshot seems to show settings for a custom block, but if you want to propose the positioning options for core blocks, you could open an issue on GitHub.
https://github.com/WordPress/gutenberg/issues/new/choose
GB21539 is related, but background positioning worked well enough for the desired effect then.