Hi
I’m trying to create a caption strip at the bottom of an image. I have found CSS to place the text correctly, but I cannot find a way to place a semi transparent background behind the text only – not the whole picture. Can you help?
Hey jonesthelight,
Try adding this css code in Quick CSS (located in Enfold > General Styling):
#top .av-image-caption-overlay-center {
padding-left: 0;
padding-right: 0;
}
#top .av-image-caption-overlay-center p {
background: rgba(255,255,255,0.3);
}
Hope this helps :)
Best regards,
Nikko
That works great – on a full size screen. How can I make the text smaller when we get down to mobile size? It is bigger than the image.
Thanks for your help so far.
Hi,
Try adding this css code:
@media only screen and (max-width:767px) {
#top .av-image-caption-overlay-center p {
font-size: 14px;
}
}
Hope this helps. Just adjust the font size as you see fit :)
Best regards,
Nikko
You guys are great! Last request for tonight – I am struggling to find how to change the size, weight and padding of the drop-down menu.
It sits a way down from the original, and I need to have 17 options, so I need to squeeze them together a bit.
You can see what I mean on the ‘Venues’ menu option at http://3pointlighting.co.uk/wordpress/four-seasons-hampshire/
Then I will leave you in peace :)
Thanks – don’t worry – found out what I was doing wrong! Great theme by the way
Hi,
Great, glad you got it working and thanks for the feedback. Please let us know if you should need any further help on the topic or if we can close it.
Best regards,
Rikard
I’m good, thanks. All working :)