Right Sidebar Top Margin

Support
#1

Hi, I have tried to find a way to move the sidebar on right up to close the top header, but it seems nothing worked, any help would be greatly appreciated.

#2

Hello Zach,

Thanks for writing in!

I don’t see sidebar on the website. However, I do see that you are using Ethos stack. You can use following CSS under X > Theme Options > CSS:

@media only screen and (min-width: 900px) {
  .x-sidebar.right {
    margin-top: -35px;
}
}

1- I have found the proper CSS code selector using the Chrome browser Developer Toolbar: https://www.youtube.com/watch?v=wcFnnxfA70g

2- For the CSS code itself, I suggest that you get started with this tutorial: https://www.youtube.com/watch?v=yfoY53QXEnI

Thanks.

#3

hi Presant, thanks very much for taking time to look into this, the sidebar is our contact form on the right side, I can move it downward, but not upward, it might be the layout of the X theme?

#4

Hi Zach,

Sorry, but would you mind providing us a direct page URL? I checked all your pages in the menu but I don’t see any contact form on any of those pages. Please clarify.

Thanks,

#5

https://tmgr.com/managed-cybersecurity-services/

We would like to move the “Contact us today,” and the whole right sidebar up to align with the page tittle “Managed Cybersecurity Services”, Ty Friech.

#6

Hey Zach,

There is a top margin by default for heading tags so please edit this code in the style.css:

.x-sidebar .wp_cta_container h3 {
    color: #f69323;
    font-size: 260%;
    text-align: center;
}

to

.x-sidebar .wp_cta_container h3 {
    color: #f69323;
    font-size: 260%;
    text-align: center;
    margin-top: 0;
}

Once you get rid of the top margin of the heading, the sidebar will be in the same level of the content because they are in the same content area while the page title is in another div.

But if you want to pull the sidebar closer to the heading area, please try this code:

@media only screen and (min-width: 900px) {
    .x-header-landmark+.x-container>.offset>.x-sidebar {
        margin-top: -100px !important;
    }
}

Hope this helps.

#7

Thanks very much and it’s working nicely!

#8

You’re welcome!
We really appreciate for letting us know that it has worked for you.

#9

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.