Adding vertical divider between main content and sidebar

Can you provide an url of your website?

I have 2 suggestions:

1) Using CSS3 box-shadow (it will not work below IE9)

#component {
    box-shadow: 3px 0px #1693a5;
}
article {
    padding-right: 10px;  /* this padding is used so that the text has some padding from the border */
}

2) Using a background image
You create an image with a rectangle of the color of the border with 3px X 1px (3px is the width of the border you want…) and set it as a background of the #component div:

#component {
   background: transparent url(url_of_the_image) repeat-y top right;
}
article {
    padding-right: 10px;
}

Another option would be to set a border-right to #component, but then you would have to redefine the widths of the bootstrap spans so that the sidebar wouldn’t jump to the bottom.

Note that it’s better to make theme changes with a child theme or with a plugin that change the css dynamically, like Jetpack.

Hope this helps!

David- I would like to do something similar to sue_gir. I tried what you stated to do for her but did not work. Any advice??

Hi Sorry it is http://www.NEAZRA.org I did figure out the border issue. I am still playing with it till I get the look that I want. I do however would like to have a custom divider show up after each widget in the sidebars what would be the easiest way to code it into the theme?