Footer Title Aligment

fabiolav

Participant

Hello there!

Working on the footer part of my website. Trying to align social-profile widget title located inside “FOOTER C”. Is there a way to realign this title only? What I’m looking for is to have “FOOTER A” widget title align to the left and “FOOTER C” widget title aligned right. I’ve tried many possible solutions suggested in other topics with not luck at all, either both titles were aligned to the right or both titles and content.
Thank you in advance, for your help!

site:
http://vectordeideas.com

Hello,

I’m not sure what is your exact issue. Can you please provide some explanatory screenshots?

You can upload screenshots to your WordPress Media Library and share a link, or you can use one of the online screenshot services.

Kind Regards, Roman.

Very sorry for the delay. Here is a link:
FOOTER SCREENSHOT

As you see, I am using all footer: a,b and c, each one with diferent aligment. FOOTER A is aligned to the left (by default), FOOTER B has a wp text widget containing an image which is center aligned, and finally, FOOTER C wich is, by defaylt aligned to the left, both title and content. What I want to do is align this last one to the right, title and content, only FOOTER C.

I tried adding this code:

.footer-widget-area .widget,
.footer-widget-area .widget c,
.widget-area .widget,
.widget-area .widget c .widget-title {
	text-align: right !important;
}

.footer-widget-area .widget,
.footer-widget-area .widget c,
.widget-area .widget,
.widget-area .widget c .widget-title:after {
    margin: 0 !important;
}

But changes both, FOOTER A and C, alignment to the right.

I also tried:

 .widget-title {
	text-align: right !important;
}
 .widget-title:after {
    margin: 0 !important;
}

It changes all widgets alignment to the right.
Please forgive me, I am an absolute beginner.
Many thanks you for your help

Hello,

It looks like you have many empty menu items there, can you please remove them, add a widget title, and let me know?

Kind Regards, Roman.

Ok. Done. Now there is title and content without empty menu items.
Thanks in advance

Great,

Please try to use the following CSS code. I wrapped it in Media Query in order to keep default alignment on mobile view, when footer widgets are in one column. As you can see, I targeted third footer widget only using :nth-child() pseudo-class.

You can add CSS code to your site with Simple Custom CSS plugin (just copy CSS code and paste it in Dashboard → Appearance → Custom CSS after installing and activating the plugin). Also you can add CSS code directly to style.css file of your child theme.

@media screen and (min-width: 768px) {
    div#sidebar-footer div.sidebar-column:nth-child(3) {
        text-align: right;
    }
}

Please feel free to ask any other questions that you might have.

Kind Regards, Roman.

It works perfectly! Thankyou so much! Thanks for thinking of keeping default aligment on mobile view. I would have never thought about that till I would have seen it. I uderstand now how to target other footer widget using :nth-child() if needed.
Again, Thank very much.

You are welcome!

I’m glad that it works :slight_smile:

Kind Regards, Roman.