CSS for blog post CATEGORY (not global)

[INcroatia]

HI X!

We have two main blog post categories, blogs and videos. (“blogs” and “video-blogs”) Each category has a different visual appearance within the post itself. One is full width the other is a Default Template with a sidebar.

To make the full width post look good, we had to add the following CSS

.single-post .x-comments-area {
padding-left: 10%;
padding-right: 10%;
}

But naturally, this is automatically applied the Default Template video posts as well. Can you please help us alter the CSS so it’s only applied to the written blogs and not the video blogs.

Examples here: Written blogs (styling is good): http://clickerexpo.flywheelsites.com/five-essential-elements-that-give-clickerexpo-its-soul/
Video blogs (the Comments section and the bottom jumps in 10% because of the global CSS): http://clickerexpo.flywheelsites.com/watch-the-clickerexpo-experience/

[christian]

Hey @INcroatia,

You can change the selector to target the blog category like .single-post .category-blog .x-comments-area or you could use the not pseudo-class like this .single-post article:not(.category-video-blogs) .x-comments-area.

Hope that helps.

[INcroatia]

Thanks! That’s exactly what we needed .category-blog

[rad]

You’re most welcome!