CSS for column settings in Footer Widget

BB Theme
1

I’d like to use 3 columns for my Footer Widget with the column widths set to 50%, 25%, 25% and not the default 33.3%, 33.3%, 33.3%

Is there some way I can target that change with CSS?

Thanks.
Doug

2

Hey Doug,

Try using the following CSS snippet. You can change the values as you like. If you want to use this on a 4 widget layout just add one more and change the child number. You can also remove as necessary.

@media (min-width: 768px) {
  .col-sm-4:first-child {
    width: 50%;
  }
  .col-sm-4:nth-child(2) {
    width: 25%;
  }
  .col-sm-4:nth-child(3) {
    width: 25%;
  }
}

Hope this helps!

Ben

3

Thanks Ben, that works.

4

No worries! Have fun with The Beaver! :slight_smile:

Ben

5

Hello

I just tried to use the code snippet from above (and as advised on http://forum.wpbeaverbuilder.com/knowledge-base/change-footer-widgets-width/), but nothing matters!

I have inserted the code to the bottom of style.css in the child theme folder. Isn’t that the correct place? When I refresh the site and inspect the page nothing has changes.

Hope anyone can help.

Cheers
Torben

6

Sorry. My (rooky) mistake! It was a caching problem :frowning:
The above code works fine :slight_smile:

7

Awesome, Torben! Glad it was just the cache! :slight_smile: Enjoy! :slight_smile:

Ben