- This topic has 7 replies, 3 voices, and was last updated 3 years, 7 months ago by
.
-
Posts
-
Hi there,
My current header is all done using the page hero element – this makes it easy to add margins to a box, for example. See here by moving the width of the browser in and out – it always has a margin to the left and right.
The problem is that the specific element cannot be used in the block editor. With this, I made something to replace it, but have had to use the after_header hook (closest hook to the page hero, I believe).
With this, I currently don’t see a way to add a margin to the box I’ve created in this element. Is there a way to do this?Staging details to view in private.
Kind regards,
Will
Customer Support
Hi William,
Sorry I’m a bit confused.
Are you referring to this element here?
https://www.screencast.com/t/2S1wPsTwJmgiIf so wouldn’t you be able to control all the paddings and margins using GB’s container spacing settings?
https://docs.generateblocks.com/article/container-overview/I would have thought so. However, it seems no matter what margin right/left I put, the container still does not have a margin to the right/left so when the browser width reduces, it does not have a margin (but sticks to both sides of the browser)…that is until it gets to tablet and mobile widths.
You can see here.
Customer Support
Hi Will,
If a container block is set to
contained width, left/right margin value will be replaced by auto no matter what value you entered.This is to make sure the container block stays in the center horizontally.
I would suggest setting the container block back to
full widthand changing the page hero hook tobefore_main_contentThat does not make it full width like a page hero (sidebar appears alongside the element).
I basically want the same as page hero but with blocks – is there anyway at all to do this currently, where you can achieve a margin left and right?
Hum.. give
inside_site_containera try.Hmm, not quite – causes the margin to appear even on very wide screens.
I managed to find a fix – use the
after_headerhook and apply this CSS:.gb-inside-container { margin: 0px 10px 5px 10px; }It’s a little annoying as had to add an HTML block to add the CSS, but it works for what I am trying to achieve.
Thanks for your help on this anyway!
Glad you figured out a solution 🙂
- You must be logged in to reply to this topic.
