I have customized my main blog page with a background padding on the following CSS. That puts the background behind the image as well. Is there a way to separate the post title, excerpt, date and categories from the image?
.blog-posts>.loading-posts, .blog-posts>li {
float: left;
margin-bottom: 40px;
box-sizing: border-box;
width: 100%;
padding: 25px 25px 25px 25px;
background-color: #fff;
border-radius: 10px;
}
Also, is there a way to make the date and categories line up next to each other instead of below?
Ideally I would like it to look like this except horizontal.
Those are customization questions and support doesn't offer customization services as we wrote on our support homepage and on this area. I will try to help you this time though
P.S: Please be aware as by doing customization if something happens like miss-editing files the responsibility is yours and we won't support you on finding the problem, as we are only guiding you how to get the results you need.
Hi,
I have customized my main blog page with a background padding on the following CSS. That puts the background behind the image as well. Is there a way to separate the post title, excerpt, date and categories from the image?
.blog-posts>.loading-posts, .blog-posts>li { float: left; margin-bottom: 40px; box-sizing: border-box; width: 100%; padding: 25px 25px 25px 25px; background-color: #fff; border-radius: 10px; }Also, is there a way to make the date and categories line up next to each other instead of below?
Ideally I would like it to look like this except horizontal.
https://www.manningstinson.com/learn-develop/
Thanks a million for all your help!
-Manning
Hi Manning,
Those are customization questions and support doesn't offer customization services as we wrote on our support homepage and on this area. I will try to help you this time though
1. In your CSS code change the padding
with this new one:
and then add this CSS code too:
.blog-posts .post-item.columned .post-details { padding-top: 25px; }2. You can add this CSS code to your Custom CSS area:
.blog-posts .post-item .post-details .post-meta { display: inline-block; margin-right: 12px; }Have a nice day!
P.S: Please be aware as by doing customization if something happens like miss-editing files the responsibility is yours and we won't support you on finding the problem, as we are only guiding you how to get the results you need.
Hi Ylli,
That worked PERFECTLY! Thank you so much.
- Manning
Happy to hear that!
I will set this ticket as solved from here.