Change Widget Background Color

• 

  tatin05 · Member · Nov 6, 2017 at 1:58 am

  • Copy link
  • Add topic to favorites

  Hello, I am using the Port Theme and I am on premium account. I need help in changing the background color of the widget I use on my page.

  I tried the codes posted here but nothing works :(

  Hoping you can help me..

  Thanks!

  The blog I need help with is: (visible only to logged in users)

• 

  krutidugade · Member · Nov 6, 2017 at 6:12 am

  • Copy link

  Hi there,

  I believe you wish to change the background color of widgets in the footer. Add the CSS code snippet to CSS Customizer to change Widget background color. You can alter the values as per your wish.

  #footer .main .inside {
      background-color: #DDA0DD;
  }

  Let me know if this works for you!

• 

  tatin05 · Member · Nov 6, 2017 at 6:29 am

  • Copy link

  Hello, krutidugade!

  Thanks for replying :) It worked however, the background is too close to the widget title and content. :( Is there a way where the background can be like the background of the other content so they can be uniform? I think it would look better if there are spacing on the sides. Is it possible for the css?

  Thank you so much!

• 

  krutidugade · Member · Nov 6, 2017 at 7:00 am

  • Copy link

  Hey,

  You can add padding to your widget area. The CSS code below will help you do so. You can replace ‘2em’ with pixel value (30px) if you wish.

  #footer .main .inside {
      background-color: #DDA0DD;
      padding: 2em;
  }

  Let me know if you need further help!

• 

  tatin05 · Member · Nov 6, 2017 at 7:16 am

  • Copy link

  Hello, thanks! It worked in desktop view but not on mobile :(

• 

  krutidugade · Member · Nov 6, 2017 at 4:33 pm

  • Copy link

  Hi there,

  I checked your site on mobile. I see the footer background color is black. I believe you figured it out. Do you still need help with this?

• 

  tatin05 · Member · Nov 7, 2017 at 12:50 am

  • Copy link

  Hello, all is okay :) Thanks for helping me out. I just have one question about the widget background. Is it possible to use a different background for another set of widget or the css code will be applied to all?

  Thank you!