Corp theme – Centre align footer

I’ve looked at this further and it seems quite problematic.

None of the standard code for css centring seem to work,
as detailed here: https://css-tricks.com/centering-css-complete-guide/

Is this something specific to the SiteOrigin plugin?

Kind regards, Violetta

Dear Andrew,

Thanks so for your help with this.

“you’d need to inspect your site and change the selector names in your CSS rule”

= Yes, I have been doing this, but what I meant above is that I have found it
extremely difficult to work out which of class or id selectors are needed to modify
the footer widget area and widgets inside it.

This maybe because the the SiteOrigin plugin creates a lot of non-descriptive
class names, for example: class=”panel-widget-style panel-widget-style-for-w5b462886061c0-0-0-0″,

If you get what I mean there…

Also, even if I do select them on some level, none of the centring code from css tricks)
works.

The widget footer area I refer to seems to be somehow aligned right for some reason,
which stops any attempt centre it.

The site I refer to is currently under development and I have ‘maintenance mode’ running
– so you can’t see it from the front end logged out.

I’d like to send you some screenshots and a copy of the code to see, but I can’t
see an option in the forum reply box here to make the message private.

Hang on will try this next… (/adminze ?)

best wishes, Violetta

If so, I will send you my code / infos?

Let me know.

Thanks greatly.

“Do you need a Layout Builder widget in your footer? If you insert eight widgets into the footer widget area, the footer will automatically create eight columns. If you’d like to simplify the markup, that’s the best way to do that. Unless you’re creating multiple rows in a column, the Layout Builder isn’t required.”

= Thanks Andrew, that’s very helpful – maybe it’s related to the layout builder in that location.

I haven’t had issues with centring other areas of the site/ page with it though, other than this problem with the footer.

“…wouldn’t prevent rules from taking effect assuming the correct selectors were targetted.”

= yes, it may be just that I’m not targeting the right one(s) – sure.

” If you’d like to open your site and send a URL we can inspect the problem. ”

= ** Ok, thanks greatly – I’ll open the site and message you back, whenever I see you reply here.

Is there an option in this forum to set replys to ‘private’ at all?

bet wishes, V.

Aha, ok, I have put it online now.

It’s here > http://www.sickbacchus.com

The footer area I’m having issues centring is the where the social media icons and
privacy / press kit etc…. is at the bottom.

= when you look at that footer on different screen sizes (iPad/ iPad pro/ 1920 x 1080 etc)
it’s jumping all over the place.

** Btw. I was attempting to build something like the footer here for reference:

http://sonyclassics.com/happyend/

It does not need multiple lines like that one right now though – just
what is there now will do, so long as I can centre it.

Ok, thanks greatly Andrew. I’ll get back to when I’ve rebuilt it and given it
a go myself.

Thanks for the great support – I’m glad I chose to use SiteOrigin.

Very best wishes

Hi there Andrew,

I’ve built this now, and had a go at centring it.
Not sure if I’ve done it correctly though (?)

Seems a lot better anyhow.

Just reply to this message again when you’re available,
and I’ll put the site on line / show you as before.

Thanks so for your help with this

Kind regards, Violetta

I did not mean the top/ main navigation menu – that is fine, yes.

I referring to how the footer items overlap on mobile.

Thanks greatly, so you think it’s this rule that is causing the items overlap
on mobile?

.site-footer .widgets .widget a {
position: fixed !important;
  _position: absolute !important;
	bottom: 0 !important;
 _top: expression(eval(document.body.scrollBottom));
	z-index: 100;
	box-sizing: content-box;
}

The problem with that is that I need that code to set the footer as a fixed position/ “sticky footer”

Trying your recommendation now anyhow – thanks Andrew

Great – I think I understand most of that, I’ll give this suggestions a try.

Seems quite tricky, sorry if so.

“Vertical stacking is the expected behavior on mobile, I’m not sure what else you’d like to do given the number of widgets.”

= I was aiming at the same behaviour as the footer items in this example site
I gave earlier: http://sonyclassics.com/happyend/

I kind of did this earlier – even though the items were rather tiny –
but the ‘overlapping items issue’ made a mess of it.

Thanks Andrew, best wishes

site online here > https://wp.me/P9RP4e-1m

Thanks greatly Andrew. Trying that now….