Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • May 7, 2021 at 6:46 pm #1299019
    805ITS

    Hi!

    I am trying to add an overlay on the caption text and title of the fullscreen slider on my home page. I searched how to do it on the forum but with no luck.

    Could someone help me with the correct CSS code I need to use ?

    Thank you so much !!

    May 9, 2021 at 9:17 am #1299158
    805ITS

    I am answering to myself, the following code I was looking for is the following : 

    /* Added Overlay on Fullscreen silder caption content*/
.avia-caption-content p {
  background: rgba(0,0,0,.2) !important;
}

/* Added Overlay on Fullscreen silder caption title*/
.avia-caption-title {
  background: rgba(0,0,0,.2) !important;
}

    Unfortunately it doesn’t overlay just the text but the entire line which isn’t really esthetic. If anyone has a solution that would be great!

    • This reply was modified 3 years, 6 months ago by 805ITS.
    May 10, 2021 at 7:05 am #1299283
    Rikard

    Hi,

    Please try this CSS instead:

    .avia-caption-content p {
  background: rgba(0,0,0,.2) !important;
  display: initial;
}

    Best regards,
    Rikard

    May 10, 2021 at 11:51 am #1299332
    805ITS

    Perfect, thank you ! :-)

    May 10, 2021 at 4:25 pm #1299419
    Nikko

    Hi 805ITS,

    We’re glad to hear that :)
    Thanks for using Enfold and have a great day!

    Best regards,
    Nikko

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘How to have an overlay on the caption text and title of the fullscreen slider?’ is closed to new replies.