Style Changes Specific to Certain Pages

  • Author
  • #2798197

    I am working on formatting the pages of my blog to display content in different ways, and am running into problems creating CSS that applies only to specific pages.

    Ultimately, the goal is to have the page “Tips from the ‘Sue’ Chefs” display as it currently does: a collection of recent posts, with the featured post displaying, then the title, then an excerpt following. The CSS that is making this happen is:

    /*Tips and Tricks- Make posts fill the width*/
    .display-posts-listing .listing-item {
    margin-bottom: 30px;
    width: 90%;

    /*Tips and Tricks- Put title on own line*/
    .display-posts-listing .title {
    display: block;

    /*Tips and Tricks- Hide hyphen for excerpts*/
    .display-posts-listing .excerpt-dash {
    display: none;

    Simultaneously, I would like to have the pages accessed under the “Categories” drop down display essentially like this blog: i.e., three columns of posts, with the featured image (of uniform size), and the post title underneath, with margins between images. I was working on that with the CSS below (spacing is working okay, but images aren’t consistent), but the CSS appears to have been overridden by the changes to the Tips page above.

    .display-posts-listing .listing-item {
    display: inline-block;
    width: 33%;
    height: auto;
    text-align: center;
    vertical-align: center;

    .display-posts-listing .listing-item {
    float: none;
    margin: 0 1px 1px 0;

    Could you help me with the CSS to get the various pages displaying properly?

    The blog I need help with is



    Let me see if I understand your request correction:

    So, the site (which is not on, is working correctly and you want to mirror that same treatment on your hosted site at


    They are two separate websites, so the CSS on one should not be overriding the other, but you may need to code them differently.

    One solution would be to choose a theme for your Stocks and Bonbons site that includes a page grid. Here’s some themes and the grid templates that they have:

    If you are not open to switching to a theme that supports grid pages, let me know and I’ll see if we can accomplish what you are looking for with CSS.

    Hope this helps!


    Thanks for responding! I took your suggestion and changed themes- I found one that has a lot more of the functionality I was looking for. Thanks again!


    Great! Glad it all worked out.

The topic ‘Style Changes Specific to Certain Pages’ is closed to new replies.