Adding a background or changing color for sidebar area

  • Resolved jphogan

    (@jphogan)


    11 years, 9 months ago

    Hello,
    Please see my page here: http://iamsinc.com/blog/adwords/
    I am attempting to either change the background color of the sidebar area or pull in a background image. I’m fairly new to css, so you’ll have to pardon me if the solution is obvious.

    I was using
    ‘#secondary .widget-area {
    background-color: #dfe1f0;
    }’
    to try and target that area, but must be doing something wrong. Can anyone tell me what I need to have to target that area with CSS? Thanks!

Viewing 2 replies - 1 through 2 (of 2 total)
  • wpismypuppet

    (@wordpressismypuppet)

    11 years, 9 months ago

    #secondary {
background-color: #dfe1f0;
}

    You don’t need the .widget-area as it is a class of the same element. What your css is saying is “look for an element with an ID of secondary, then find an element WITHIN that with a class of .widget-area”.

    What you want to say is “look for an element with an ID of secondary” OR “look for an element with a class of widget-area”. Either one will work.

    In any event, it’s going to look weird because the width of the sidebar is small and it’s using a margin-right. You’ll want to change this:

    #secondary {
	float: right;
	margin-right: 7.6%;
	width: 18.8%;
}

    To this:

    #secondary {
	float: right;
	padding: 0 3.8%;
	width: 18.8%;
}

    As a start… you’ll probably want to play around with it more to get it to look right. Also, add your background-color property to this block of css… it’s found on line 94 of your style.css file.

    Thread Starter jphogan

    (@jphogan)

    11 years, 9 months ago

    Thank you so much for your detailed help. I really appreciate you telling me specifically why it does what it does. Thanks!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Adding a background or changing color for sidebar area’ is closed to new replies.