I need the sidebars of my current theme to be smaller and for the content inside of them to be centered. I have attempted to do this myself, but the css style for my theme is very confusing and hard to work with. This is part of the code that generates my sidebars:

#sidebar_left {
float:left;
position:relative;
left:-0px;
width:200px;
margin-left:-220px;
padding:0 10px 10px 10px;
}
#sidebar_right {
background:url('*****/sidebar_right_background_imageurl.png') repeat-y;
float:right;
position:relative;
right:-1px;
margin-right:-220px;
padding:0 10px 10px 10px;
}
#sidebar_left, #sidebar_right {
color:#666666;
display:inline;
width:200px;
margin-right:-219px;
}


#sidebar_left li a,#sidebar_right li a {
text-decoration:none;
color:#337FA9;
height:100%;
padding:0em 0;
line-height:1.5em;
padding:0 px;
color:#666666;
background:;
}
#sidebar_left li a:hover,#sidebar_right li a:hover {
color:#866b62;
text-decoration:none;
background:;
}
#sidebar_left li,#sidebar_right li {
font-family:;
font-size:0.75em;
color:#666666;
}
#sidebar_left li li,#sidebar_right li li {
font-size:1em;
color:#666666;
font-family:helvetica,sans-serif;
padding:0px;
}
#sidebar_left ul,#sidebar_right ul {
list-style-type:none;
}
#sidebar_left p, #sidebar_right p, #maincontent p, #sidebar_left div, #sidebar_right div {
letter-spacing:0em;
line-height:1.375em;
padding:0.1875em 0em 0.1875em 0em;
font-size:0.75em;
color:#666666;
font-family:helvetica,sans-serif;
}
#sidebar_left ul, #maincontent ul, #sidebar_right ul {
margin:0;
padding:0;
}
#sidebar_left, #sidebar_right {
color:#666666;
font-family:helvetica,sans-serif;
}
#sidebar_left input#s {
width:100%;
}
#sidebar_left h3, #sidebar_right h3 {
margin:0;
padding:0.75em 0 0.75em 0px;
font-style:normal;
font-weight:normal;
font-size:1.125em;
color:#3A54B9;
font-family:tahoma,geneva,sans-serif;
letter-spacing:0em;
line-height:1.125em;
background:
}
#sidebar_left h3 a, sidebar_right h3 a {
color:#3A54B9;
text-decoration:none;
}
#sidebar_left h3 a:hover, sidebar_right h3 a:hover {
color:#3A54B9;
text-decoration:underline;
}


Check out my wordpress site so you can see the issue for yourself - InsaneFreeStuff.com

Seams simple enough. As it seams, the width is only defined one place, which makes things a lot easier. You can remove the first width declaration on the #sidebar_left selector, as its being defined for both later anyway.

 
#sidebar_right {
background:url('*****/sidebar_right_background_imageurl.png') repeat-y;
float:right;
position:relative;
right:-1px;
margin-right:-220px;
padding:0 10px 10px 10px;
}
#sidebar_left, #sidebar_right {
color:#666666;
display:inline;
width:150px;
margin-right:-219px;
text-align:center;
}

Above is some shared styles between both menus, now try to adjust the width as needed. You should be able to center its content by applying text-align:center; and or margin auto; to the children them self.

That would be the ul elements i presume.

#sidebar_left ul,#sidebar_right ul {
list-style-type:none;
margin: 0 auto;
}

But note that centering usually is considered a bad-design practice, its bad for readability.

I tried what you suggested, but it's still not working out. Thanks for your response.