Viewing 3 replies - 1 through 3 (of 3 total)
  • Hi VMPartners.

    1. Add the white underline under each link

    Looking at the .com, the menu in the left that includes the underlines is showed using:

    <ul id="navlist">
        <li><a href="become-ucc-consultant.html">Request Additional Information</a></li>
        <li><a href="consulting-resources.html">Here’s What You Get</a></li>

    The replicate this same ‘style’, I recommend reviewing the styleshoot for the navlist id.

    I suspect that this is the formatting that shows the whitelines at the bottom:

    #sidebar #navcontainer li.last {
    	border-bottom-width: 0px;
    	border-bottom-style: solid;
    	border-bottom-color: #FFF;
    }

    2. add the blue lines on the right hand side

    For the sidebars and the blue, you could simply set border-right and border-bottom to both have a border width of 1px, solid, and a blue color.

    Are you familiar enough with css to make these changes?

    Thread Starter vbpartners

    (@vbpartners)

    Thanks for the tips. I’m learning css and have some basic knowledge at this point.

    1. i dont see the #sidebar #navcontainer li.last in the style.css.

    2. blue border on right and bottom:

    I added the last two lines here – but nothing shows:

    /* begin LayoutCell, sidebar1 */
    .art-content-layout .art-sidebar1
    {
      width: 25%;
      background: #c2cbd2;
      border-right: solid 1px #fdc101;
      border-bottom: solid 1px #fdc101;

    am i missing something or did i write that wrong?

    1. i dont see the #sidebar #navcontainer li.last in the style.css.

    That items is currently contained in your styles/navigation.css file. Sometimes you have to search through several css files as sites can have more than one.

    2. blue border on right and bottom:

    It looks like the borders you are trying to set are actually more of an orange, not a blue. I like to find colors using this tool:
    https://www.colorschemer.com/online.html

    I would also recommend trying:

    .art-content-layout,
    .art-sidebar1
    {
    width: 25%;
    background: #c2cbd2;
    border-right: solid 1px #fdc101;
    border-bottom: solid 1px #fdc101;
    }

    Basically, I added a comma between the two class names.

    Let me know if this help!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Formatting sidebar’ is closed to new replies.