Adding line or border around sidebar

Tagged: sidebar styling

This topic has 2 replies, 2 voices, and was last updated 11 years ago by Wes.

Viewing 3 posts - 1 through 3 (of 3 total)

Author

Posts
April 17, 2013 at 6:05 pm #3951
Emma1202
Customer
How would I go about adding a blue line to the left of the sidebar to separate it from the main content? How would I modify the CSS?

My mock site is http://www.jmmlifecoaching.com Thanks!
April 17, 2013 at 7:23 pm #3953
Emma1202
Customer
If I wanted to maybe just shade it like the welcome box on the home page, where would I add the background code (background: #f2f2f2;) in the Stylesheet?
April 17, 2013 at 9:40 pm #3958
Wes
Moderator
To add a border to your sidebar, you can take a look around line 1435 in your css for – “.sidebar” and add in code similar to this –

`.sidebar {
border-left: 1px solid #12335e;
display: inline;
float: right;
font-size: 0.875em;
line-height: 1.5em;
padding-left: 20px;
width: 280px;
}`

Notice I added “border-left” (the border itself) and “padding-left” (to add space to the left of the sidebar)……you can start off with this and make your adjustments as needed.
Author

Posts

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.