image divider between widgets on sidebar

[azparis]

For the life of me, I just can't find the css to add an image between widgets on the sidebar! I can get the image as a background behind the widget, but that's obviously not I want!!! Been using Firebug and still can't figure it out. Any help is appreciated! I'm running Lifestyle Pro child theme.

http://tinkerbdesigns.com/TCBOTB/

http://tinkerbdesigns.com/TCBOTB/

[eamonmoriarty]

In your style.css around line 1317 you have:

.sidebar .widget {
	background:url(http://tinkerbdesigns.com/TCBOTB/wp-content/uploads/2013/11/sidebar-scroll.png) no-repeat;
	margin-bottom: 10px;
	margin-bottom: 0.2rem;
	padding: 32px;
	padding: 3.2rem;
	text-align: center;
	margin-right:30px;
}

If you change this to:

.sidebar .widget {
    background: url("http://tinkerbdesigns.com/TCBOTB/wp-content/uploads/2013/11/sidebar-scroll.png") no-repeat scroll center bottom rgba(0, 0, 0, 0);
    margin-bottom: 0.2rem;
    margin-right: 30px;
    padding: 3.2rem 3.2rem 14rem;
    text-align: center;
}

you should get the desired result. Adjust the 14rem in the padding to suit yourself.

There are probably more elegant solutions but I think this one works.

---

Eamon Moriarty
EM Dzine

[Author]

Posts