Sidebar color - Ethos

I was able to set the sidebar color for pages using the background color in Theme options > Layout & Design > Background color:

But the sidebar color is not showing in the individual posts.

I tried adding this css based on another support thread:

    .x-sidebar {
background-color: #F3F3F3;
}

This changes part of the sidebar, but it doesn’t fill the entire width or height of the sidebar.

Hi Dave,

Thank you for writing in, you have this on your Theme Options > CSS

body.blog, body.single-post {
    background: #fff;
}

Please remove that and you’ll get the #f3f3f3 background-color you set on Theme Options > Layout & Design

Hope it helps,
Cheers!

Awesome, thanks for the quick reply!

Is there a way to fix the margin/padding of the featured image? It’s flush with the right edge sidebar, but I’d like it to match the margin on the left main nav bar.

Or remove the margin on the left of the featured image…either way, just want the left/right margins of the featured image to match. I tried this, but it doesn’t seem to do anything:

.entry-featured {
margin-left: 0px;
padding-left: 0px;
}

Hi Dave,

That is actually tricky than it looks because the space in the left side of the feature image is the main container left margin which should be always equal to the right space.



What we can only do, is totally remove that left and right main container margin.



.single-post .x-container.max.width.main {
	    max-width: none;
    width: 100%;
}

.single-post .x-main.left {
	padding-right: 0;
}

.single-post .x-main.left .entry-featured {
	margin-right: 0 !important;
    padding-right: 0;
}

Thanks,

That works…I actually like the full-width look of the featured image better anyway. Thanks1

The only issue now, it the sidebar content is flush with the right edge of the page. Is there a way to add padding/margin to the right side of the sidebar?

// edit…I think I figured it out…does this look right?

.x-sidebar {
background-color: #F3F3F3;
padding-right: 25px;
}

Yes, that is right. But the padding-left of sidebar is 35px, so you might want to update the padding-right: 35px to make it accurately equal.

And you can remove the background-color: #F3F3F3;

Cheers!

Awesome, thanks so much! You guys ROCK!

We are delighted to assist you with this.

Cheers!

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