• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar
Appfinite

Appfinite

Premium WordPress Themes for The Genesis Framework

  • Themes
  • Blog
  • Tutorials and Resources
  • Forums
  • Contact Us

Adding line or border around sidebar

Home › Community Forums › Legacy Theme Support › Adding line or border around sidebar

Tagged: sidebar styling

  • This topic has 2 replies, 2 voices, and was last updated 9 years, 9 months 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.
Log In

Primary Sidebar

Search Forums

Affiliate Program

Looking to earn some money? Join our Affiliate program and earn 35% of every sale you refer. Top referrers earn 40-50%.

Join Now →

The Genesis Framework

All of our themes are designed for the Genesis Framework. You will need to purchase Genesis in order to use any of our themes.

Purchase Genesis

Hire a Web Developer

Need help setting up or customizing your website?

Contact Us →

Search Full Site

  • Buy Genesis!
  • Shopping Cart
  • Themes
  • My Account
  • Support Forums
  • Tutorials and Resources
  • Privacy Policy
  • Contact Us
  • Follow Us on Twitter

Copyright © 2023 · Appfinite · Built With The Genesis Framework