Footer row full width

[Kobber]

Hi,

I’m trying to create a footer with a row instead of containers (for better responsiveness).

I’ve placed the row inside a container but I can’t get the row to go full width inside this container. There’s a margin to both sides?

[ruenel]

Hello @Kobber,

Thanks for writing in!

You can actually add 4 containers in a Bar element so that you can have 4 columns like this:

Or you can just have 1 Container and insert a Row element instead:

Kindly let us know how it goes.

[Kobber]

Hi @ruenel

Thanks - I know how to do footers with containers, but that wasn’t the question ;-).

I also know how to do footers with a row - take a look at the attached image. My question was how I can get the row to fill the container - there is space to each side.

You can also take a look here: Logo Design Studio

[tristup]

Hi @Kobber,

It seems that you have enabled the Global Container in the Bar as shown in the second screenshot, and that is why the Global sizes are applied to the footer. I would suggest you deselect and set the width to 100% to get the full-width footer.

Hope it helps.
Thanks

[Kobber]

It works fine when in the largest screen size, but on smaller breakpoints it doesn’t…? It removes the gutter to the right.

[tristup]

Hi @Kobber,

It works as intended on the smaller screen, but can’t understand what you are trying to achieve here. If the width is the problem, please set the Max Width and add the padding to the Row to adjust the spacing.

Hope it helps.
Thanks

[Kobber]

Hi,

I wanted to use a row with 4 columns instead of using 4 containers.

With a row I can set the number of columns/responsiveness for the different breakpoints - I can’t with containers. When using containers on this current project, I would have to create 3 bars which switches on or off during breakpoints - and I just thought that it would be way easier to use a row instead.

My image shows that my row has a width of 100%. That row is inside a container and the bar itself is set to have gutters of 40px. Somehow the row overrides it on smaller screens.

The columns you see above in the image has no sizes/max sizes and as you can see, the template says 50% 50% on the columns, so why on earth does it look like 75/25-ish? And why is the gutter to the right gone?

[christian]

Hey @Kobber,

I don’t see that “loss of gutter” issue in the frontend. There is space on the left and right side.

You mentioned the columns looks like 75/25. It’s 50/50 when I checked in the frontend. If the issue only happens in the builder, please give us WordPress access so we could check the issue.

Provide the following details in a Secure Note

• WordPress Login URL
• Admin username and password

You can find the Secure Note button at the bottom of your posts.

Thanks.

[Kobber]

Hi,

I’m not using the example as in my attached image live, since I don’t want my customers to see it, so that’s why you can’t see it either, but when I experienced with it, it was both in the builder and live.

The footer you see live now - I’ve tried to set that to be 100% in width as in my example, but that made the mess I explained before. That’s why I now have a footer that is more narrow than the rest of my content (which isn’t optimal).

[ruenel]

Hello @Kobber,

Can you please share the Container element settings? If possible, please provide us your WP access so we can check it and figure out what it is not working for you. Normally, it should be like this:

Best Regards.