Margins shifted?

Hello,

I am very happy with the Activello theme and I have already made some custom changes with the help of this forum (see below).

But there is a problem left and I did not find a solution for it searching this forum. So I would like to ask this here.

As you can see at the screenshot (my website is not online yet) the main content of the site as well as the sidebar seem to be shifted to the right in relation to the header graphic and the line underneath. I have marked it with red lines at the screenshot.

I would like to have both - the content and the sidebar - in the same area as the header graphic and the line, between the red lines. Can you give me some css code for it?

I have only done this change concerning the content and the sidebar, cause they were to close together for my taste:

@media (min-width: 992px) {
.main-content-inner.col-sm-12.col-md-8 {
width: 65%;
margin-right: 80px;}

div#secondary{
width: 24%;
font-size: 14px;}

Thank you very much in advance for your help!
GibsonLG

Hi GibsonLG,

I hope you are well today and thank you for your question.

You can try resolving the issue by changing shared CSS code as following.

@media (min-width: 992px) {
.main-content-inner.col-sm-12.col-md-8 {
width: 65%;
}

div#secondary{
width: 24%;
font-size: 14px;
float: right;
}

}

Best Regards,
Movin

Hello Movin,

thanks for your reply. Unfortunately the code doesn’t solve the problem. It’s still the same.

Something that I noticed: This “shifting” only happens when the browser window is wider. E.g. if the adjustment bar for the theme opens at the left, the position of the main content and the right sidebar fits.

Greets
GibsonLG

Could you please try removing your shared CSS code from your site and see in that situation whether it works fine or not?

I can’t reproduce the issue on my test site by using your shared CSS code so i think there may be some additional changes you have made on your site causing this issue.