4.2.2 - Global Blocks in header builder

So as I haven’t done this before not sure if it is a bug.

I needed two bars in the header but I needed them both fixed. This seems problematic to create and I had all sorts of weird results so I ended up creating one bar that I loaded a global block into.

  1. In the global blocks display when I added my inline menu which has drop down I ended up with scroll bars in the preview. ( I understand why this happens but it is a bit disconcerting.)
  2. when I added the global block into the bar it did not take up the full width of the bar. content length etc. of the bar is set to 100%.

The bar was set to full width with no outer spacing, padding or margins. The global block was also set to full width.

I had to add element CSS of the container even though everything was set to 100% in the builder settings.

$el.x-bar-container, $el .x-global-block { width: 100%; }

Hi @urchindesign,

Yes, unfortunately the extra CSS to set a width on .x-global-block will be needed in this case because the Global Block wrapping div doesn’t really have any styling.

Thanks. No problem it just felt like a strange behaviour.

I don’t use a lot of global blocks but the expectation for me was that they would always fill the space they were added to.

That makes sense. I think we’ll just leave it for now since I’ve not seen it come up since before after all this time. We’re also keen on exploring the possibility of Global Elements after Responsive Styling is complete. This would help reduce the need for Global Blocks in general.