• Resolved chloeponee

    (@chloeponee)


    Hi,
    I’ve applied some custom CSS to my website so that the sidebar is positioned on the left of the posts, instead of on the right.

    However, this caused the divider/border to also sit on the left of the screen, but I want it to sit to the right of the sidebar, inbetween the sidebar and the posts.

    I’ve coloured the divider red so it’s easier for you to see.

    Is there a way to fix this? Thanks ??

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • First, let’s undo the red border you added. Please remove the following code from the ADDITIONAL CSS box of Customizer:

    .is-sidebar aside.sidebar:before{
        left: 0px;
        border-color: red!important;
    }

    And let’s remove the original white border. Please add the following CSS code:

    .is-sidebar aside.sidebar:before {
        border: none;
    }

    The above two should completely remove the border to the left of the sidebar. I’ll recommend you do the above first, save, and test to be sure we’re on the right track before proceeding.

    If the existing border is gone, now you can add your desired border to the right of the left sidebar.

    There are several ways to do it, but I prefer the easier approach of adding a right border to the sidebar container itself, instead of messing with the ::before and ::after pseudo-classes. The following should do the trick:

    .is-sidebar aside.sidebar {
        border-right: 1px solid red;
        padding-right: 3%;
    }

    Please change the border color from red to your desired color, and adjust the amount of padding space as desired.

    Also, note that you previously used the above selector .is-sidebar aside.sidebar, so you may want to merge the two styles defined above into your existing one to have a cleaner code.

    Standing by for feedback.

    Thread Starter chloeponee

    (@chloeponee)

    That did the trick! Thank you so much ??

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Position divider to the right’ is closed to new replies.