Page 1 of 1

Change title background colour

Posted: 04 Jul 2016, 11:30
by GeoPal
Hi Karl,
Just a quick one, is there an easy way to change the transparency of the background of the text on the titles of folders in the gallery, so it is black?

http://www.studiocreative.bg/projects/
2016-07-04 18_11_17.jpg
black background on text
2016-07-04 18_11_17.jpg (23.18 KiB) Viewed 3454 times

Re: Change title background colour

Posted: 04 Jul 2016, 20:35
by mjau-mjau
You can ALMOST achieve as in your screenshot with custom CSS. The problem is, in your screenshot, you have made a nice "text label" background ... That only works by changing the text element to "inline", but then it doesn't accept padding on left or right. You would also need to tweak some other settings, and it would look similar to below. As you can see, there is no padding on left/right:
Image

Try this for a start, but you may have to tweak it, and it might not be exactly as you want:
Code
.images.caption-bottom figcaption {
  background: transparent;
}
.images figcaption > span {
  display: inline;
  background: black;
  padding: .15em;
}

Re: Change title background colour

Posted: 05 Jul 2016, 02:06
by GeoPal
Thank you Karl, will try this asap.
Have a great day!
Best, G

Re: Change title background colour

Posted: 06 Jul 2016, 05:10
by studioCREATIVE
Hello,

How can I remove the transparent background

Thanks!

Re: Change title background colour

Posted: 06 Jul 2016, 06:10
by mjau-mjau
StudioCreative wrote:How can I remove the transparent background
That should have worked with some of the code I already provided:
Code
.images.caption-bottom figcaption {
  background: transparent;
}
However, it depends on the caption-alignment you are using, and/or may be over-ruled by other CSS. You can try the following code instead, but keep in mind this will globally remove the translucent background from ALL captions:
Code
.images figcaption {
  background: transparent !important;
}
Full code would be:
Code
.images figcaption {
  background: transparent !important;
}
.images figcaption > span {
  display: inline;
  background: black;
  padding: .15em;
}

Re: Change title background colour

Posted: 06 Jul 2016, 09:16
by GeoPal
Perfect! Respect!

http://www.studiocreative.bg/projects/

Best, G