Make an icon forever visible

  • Resolved krekadra

    (@krekadra)


    9 years, 9 months ago

    Hello. I like an overlay icon on post image, but I wonder how can I make the figcaption forever visible.
    May be it’s stupid, but I can’t find an actual string in css.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter krekadra

    (@krekadra)

    I have found a solution =D
    Sorry for that question, maybe my post will help to somebody)
    I have made following change.
    1. Found this code in style.css

    figure.entry-featuredImg p {
	padding: 0;
	margin: 0;
	position: absolute;
	font-size: 50px;
	margin-left: -22px;
	margin-top: -45px;
	width: 44px;
	height: 90px;
	top: 50%;
	left: 50%;
	color: #ffffff;
	opacity: 0;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(0,20px,0);
	transform: translate3d(0,20px,0);
}

    2. Added a string opacity: 1; at the end.

    Am I right? Maybe there is a better solution?

    Thread Starter krekadra

    (@krekadra)

    If you want to show an overlay image only on blog page, you should add an additional rule to your css: 

    .blog figure.entry-featuredImg p,
.archive figure.entry-featuredImg p {
	opacity: 0.75;
}

    In my turn I have set opacity to self-transparent.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Make an icon forever visible’ is closed to new replies.

Tags