Home › Forums › Support › Blog post title overtop of featured image with a transparent black box under it.
- This topic has 9 replies, 2 voices, and was last updated 7 months, 3 weeks ago by
David.
-
AuthorPosts
-
May 26, 2020 at 6:39 pm #1302834
Jeffrey
Hello,
I have tried this many different ways, but I can’t seem to crack it. I have attached the web url to see what I’m referring to.
and what I want is for the titles to show up over the featured image, but attached to the bottom, so no matter how it is dynamically sized, the title will always be 20 pixels from the bottom of the image. This is similar to the way that the titles overlay on the Dispatch theme. However, I’d also like to have a semi-transparent black box/background to the text.
What CSS should I be using to get that result over my featured images in that category list?
Thanks in advance for any suggestions.
May 27, 2020 at 1:20 am #1303105David
StaffCustomer SupportHi there,
Can you provide me with a temporary login to access that URL?
As the URL is hidden to others you can post the details hereDocumentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/May 27, 2020 at 7:03 am #1303430Jeffrey
I’m sorry… I forgot that we had started working on hiding some of the pages from visitors who aren’t logged in.
Try this
May 27, 2020 at 7:44 am #1303485David
StaffCustomer SupportOk so i can log in but that URL does not take me anywhere ?
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/May 27, 2020 at 11:24 am #1303920Jeffrey
— I’m reconfiguring a few things. I’ll have to send you a new link in a bit.
How can I send you a link so it isn’t visible to the world?
May 28, 2020 at 1:23 am #1304569David
StaffCustomer SupportYou can edit your Original Topic and change the Site URL
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/May 28, 2020 at 12:22 pm #1305475Jeffrey
Hi David,
I revised the url, so you should be able to get to it now.
Thanks,
May 29, 2020 at 12:34 am #1305957David
StaffCustomer SupportTry this CSS:
.category-highschoolsports .inside-article { position: relative; } .category-highschoolsports .entry-header { position: absolute; bottom: 15px; /* increase value to move up */ left: 15px; /* increase value to move right */ padding: 20px; background-color: rgba(0,0,0,0.8); /* Adjust RGBA 0.8 value for opacity */ z-index: 100; }
BTW – the link was a list of Video posts …. so i hope its the right one 🙂
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/May 30, 2020 at 5:51 am #1307520Jeffrey
This is exactly what I was looking for! Thank you so much!
May 30, 2020 at 6:56 am #1307571David
StaffCustomer SupportAwesome – glad to be of help
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/ -
AuthorPosts
- You must be logged in to reply to this topic.