Title: Sidebar border
Last modified: March 15, 2017

---

# Sidebar border

 *  Anonymous User
 * (@anonymized-15351932)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/sidebar-border/)
 * _[ Moderator note: [moved to Fixing WordPress](https://wordpress.org/support/topic/before-posting-in-everything-wordpress/?view=all).]_
 * I’m using the Midnightcity theme (unfortunately it is no longer supported by 
   the developer who was brilliant with providing assistance)
 * I would like to insert a thin yet clearly visible vertical blue line separating
   the right sidebar from the main content.
 * Could someone provide a custom CSS for this please…?
 * [http://www.quantumliving.com.au](http://www.quantumliving.com.au)
 * thanks!

Viewing 9 replies - 1 through 9 (of 9 total)

 *  [mdshak](https://wordpress.org/support/users/mdshak/)
 * (@mdshak)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/sidebar-border/#post-8915748)
 * Hi,
    Please go through the Admin Dashboard > Appearance > Editor > Here you will
   get the style.css file by default to edit. Here paste the given below of code
   at end of style.css file and update. Hope it will help you. Let me know the feedback.
 * #sidebar {
    border-left: 1px solid blue !important; padding-left: 5px !important;}
 * Thanks
    Mohammad
 *  [Hugues](https://wordpress.org/support/users/hugaud/)
 * (@hugaud)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/sidebar-border/#post-8915787)
 * Hi,
    Try this code. I adjusted left margin and added some left padding. Without
   tweaking the margin your side bar gets thrown below the content. You can add 
   this in the customiser > additional CSS if you prefer not to edit your style.
   css file.
 * Try and avoid using the !important tag if at all possible as it can have unintended
   impact elsewhere in the css cascade:
 * #sidebar {
    float: right; margin: 35px 0 0 10px; padding-left: 10px; width: 290px;
   border-left: 1px solid blue; }
 * I hope this works for you
    HUgues
    -  This reply was modified 9 years, 2 months ago by [Hugues](https://wordpress.org/support/users/hugaud/).
      Reason: changed colour to blue
 *  Thread Starter Anonymous User
 * (@anonymized-15351932)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/sidebar-border/#post-8915864)
 * Thank you Hugues and mdshak – I have tried both solutions and they purshed my
   sidebar down to the end of the content on the page – not good.
 * I’d like to update my objective.
 * Since I have a light grey background on the whole page, I’d like to make my sidebar
   background colour about 2-3 shades **Lighter** so that it stands out without 
   borders as such, and without being pushed down the page.
 * I would be most grateful for a custom CSS that would do that 🙂
 * many thanks !
 *  [mdshak](https://wordpress.org/support/users/mdshak/)
 * (@mdshak)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/sidebar-border/#post-8916396)
 * Hi,
    My code is perfect and tested so please keep it at style.css and inform 
   me. I will check live and resolve it. Thanks Mohammad
 *  [Andrew Nevins](https://wordpress.org/support/users/anevins/)
 * (@anevins)
 * WCLDN 2018 Contributor | Volunteer support
 * [9 years, 2 months ago](https://wordpress.org/support/topic/sidebar-border/#post-8916481)
 * @magicpowers, Just be aware that when the theme is updated, any modifications
   made to the theme’s files will be erased.
 *  [mdshak](https://wordpress.org/support/users/mdshak/)
 * (@mdshak)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/sidebar-border/#post-8916735)
 * Hi,
    I would suggest to use the child theme first to make any changes. Or you
   may use this plugin [https://wordpress.org/plugins/simple-custom-css/](https://wordpress.org/plugins/simple-custom-css/)
   for custom css. It will prevent the code from theme update. Thanks Mohammad
 *  Thread Starter Anonymous User
 * (@anonymized-15351932)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/sidebar-border/#post-8920829)
 * thank you all for your replies.
 * as I said in my previous post, I have decided to change the background colour
   of the sidebar, rather than adding a vertical line as it doesn’t have the effect
   I want.
 * I will not muck about with the theme (it goes beyond my level of web coding knowledge),
   and will work only with custom css (safe!). If this can’t be done by custom css,
   I will get a pro to fix it for me.
 * many thanks
 *  [Hugues](https://wordpress.org/support/users/hugaud/)
 * (@hugaud)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/sidebar-border/#post-8920982)
 * Hi,
    Try this code it should work – just replace the “blue” value with whatever
   hex colour you’d like, I tweaks padding and margins too:
 * #sidebar {
    float: right; margin: 20px 0 0 10px; width: 290px; background-color:
   blue; padding: 10px 10px 0 10px; }
 * I would recommend adding the CSS in the customiser as it’s a simple change, here:
 * > [View post on imgur.com](https://imgur.com/9U0kgiK)
 * I hope this helps you.
    Hugues
 *  Thread Starter Anonymous User
 * (@anonymized-15351932)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/sidebar-border/#post-8921168)
 * Hi Hugues
 * thank you – however this custom css has made my ENTIRE sidebar disappear…..! 
   so can’t use it.

Viewing 9 replies - 1 through 9 (of 9 total)

The topic ‘Sidebar border’ is closed to new replies.

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 10 replies
 * 4 participants
 * Last reply from: Anonymous User
 * Last activity: [9 years, 2 months ago](https://wordpress.org/support/topic/sidebar-border/#post-8921168)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics