Different CSS for article templates
I'm trying to create a new article template in my Guide theme, and I'm wondering how/if I can use different CSS for the new template.
Specifically, my default article template includes a small border around any images in the article. It's coded in the style.css file as:
.article-body img {
height: auto;
max-width: 100%;
border: 1px solid #ECECEC;
border: 1px solid rgba(0, 0, 0, 0.07);
padding: 3px;
}
I have a couple of articles for which I'd like to remove the borders around images. I thought having a different article template in the theme that I could use for those articles would solve the problem, but I'm not sure what to put in style.css that would distinguish between the two different article templates.
-
Hi Kimber Wiggs, you could add an additional css selector to the div that currently has the .article-body selector. Then add something like the following to your stylesheet:
.article-body img {
height: auto;
max-width: 100%;
border: 1px solid #ECECEC;
border: 1px solid rgba(0, 0, 0, 0.07);
padding: 3px;
}
.the-new-class img {
border: none !important;
}Your html would look like this:
<div class="article-body the-new-class">
<img>
</div> -
Thank you so much!
-
Thanks Christopher Stock
Please sign in to leave a comment.
3 Comments