Styling “Footer Section One” and Widgets inside it

Hire a WordPress Expert on Codeable
Updated On: June 23rd, 2020 0 Comments

To begin the styling, download the following grey background image and put it inside the assets/img directory. 

We will apply the above image as a background to the Footer Section One <div> element using the CSS.

Now, add the following CSS at the end of the style.css file:

  6.Footer Styles
#site-footer .widget{
#site-footer .widget:last-child{
#site-footer .widget h4{
	text-align: center;
	padding:65px 15px 70px;
.footer-section-one #text-4 a{
	display: inline-block;
	margin:0 5px;
.footer-section-one #text-4 .textwidget{
.footer-section-one .widget_media_image img{
	display: block;
	margin:0 auto;

Here is the updated outline of our style.css file:

Alright, Let’s go back to the Homepage in the browser and refresh it!

“Haha! Finally, I am seeing something fruitful to my eyes :P”

I am glad you liked it 😛

Anyway, in the next lesson, we will continue to build our site’s footer by dealing with the Email Subscription form.

Leave a Reply

Your email address will not be published. Required fields are marked *