I currently use the Suffusion theme for a couple of my websites and one of the problems that I faced when modifying the CSS file was to eliminate borders for sidebars. I googled for days, I was’t able to do fix the issue.

Luckily, I finally found a solution and this is what I want to share with you all. I will give a step-by-step example of how to remove the Suffusion theme sidebar borders (one of my websites will be used as a demonstration purpose – http://www.studentloansinfocenter.com).

The screenshot below shows the overall layout of the site. If you closely look at the sidebar section, it has grey borders all over.

If you want to remove sidebar borders in Suffusion theme, here is what you need to do:

1. Login to your WordPress admin panel
2. Go to Appearance –> Editor
3. You will see a stylesheet file (style.css) is selected by default
4. Scroll to the bottom of the stylesheet file (style.css)
5. Add one or more of these css codes below in order to eliminate borders for sidebars (refer to the above image)
For “Sidebar 1″ area: #sidebar div.dbx-box { border: none; }
For “Sidebar 2″ area: #sidebar-2 div.dbx-box { border: none; }
For “Wide Sidebar Top” area: #wsidebar-top div.dbx-box { border: none; }
For “Wide Sidebar Bottom” area: #wsidebar-top div.dbx-box { border: none; }
6. Click the “update file” button

That’s it.

For example, I wanted to remove all sidebar borders except for the “wide sidebar bottom” section for my website. So I entered the following codes in the style.css file:

#sidebar div.dbx-box, #sidebar-2 div.dbx-box, #wsidebar-top div.dbx-box {border: none;}

If you look at the site (Student Loans Information Center), you will see all of the sidebar borders except for the wide sidebar bottom area are removed.