[Ken leidner]

I would like to put a box around each page I have added to the Featured Content section of the Theme. Or at least a vertical line between each of the 4 columns, in my case, to help separate them. Can the line after the Featured Content section be made darker?

I am using the free version of the Catch Responsive theme. Website is here (https://rarclubackup.website) and as you can tell it is a work in progress.

[Skandha]

@ken-leidner: Hello there,
Go to => Appearance => Customize => Additional CSS and add the following CSS Code.

#featured-content {
    border-bottom: 5px solid #eee;
}
#featured-content .featured-content-wrap article:not(:last-child) {
    border-right: 1px solid #000;
}

Let me know if this is what you want!
Kind Regards,
Skandha

[Ken leidner]

Yes, except when I have more items then columns. 4 item and 4 columns it is great, 4 items and 3 columns the single item in the “second” row has no vertical line. 5 items and 3 columns there is a vertical line between the two items on the second row.
For now limiting the featured content to the number of columns will work.

I did do this, below, to have lines on both sides of an article. The only down side is the double lines when there is a short article. That an it seems so wordy, is there a something like
#featured-content .featured-content-wrap article:child {(border-left,border-right): 1px solid #000;
I know that isn’t the right syntax but you get the idea.

#featured-content {
border-bottom: 5px solid #eee;
}

#featured-content .featured-content-wrap article:first-child {
border-left: 1px solid #000;
}
#featured-content .featured-content-wrap article:last-child {
border-right: 1px solid #000;
}

#featured-content .featured-content-wrap article:not(:last-child) {
border-right: 1px solid #000;
}

#featured-content .featured-content-wrap article:not(:first-child) {
border-left: 1px solid #000;
}

[Skandha]

@ken-leidner: Hello there,
Please use the CSS Code below instead of the previous code I provided you.

#featured-content .featured-content-wrap article:last-child {
    border-right: 1px solid #000;
}
#featured-content .featured-content-wrap article {
    border-left: 1px solid #000;
}
.featured-content-wrap {
    display: flex;
    flex-wrap: wrap;
}

Let me know if this is what you want!
Kind Regards,
Skandha

[Ken leidner]

Perfect!!

Thanks for the help!

[Skandha]

@ken-leidner: Hello there, I hope I was able to resolve your issue. If it’s not too much trouble, I have a quick request: could you please leave an honest review?
https://wordpress.org/support/theme/catch-responsive/reviews/#new-post
Your review will help others know what to expect when they’re looking for the support I offer. Even a sentence or two would be hugely
appreciated. Thanks, and if there’s anything else at all that I can do to help, don’t hesitate to let me know. Have a great weekend! 🙂

Kind Regards,
Skandha

[Author]

Posts