Overflow text fade?

  • misslucyloo

    (@misslucyloo)


    9 years, 10 months ago

    How do I make the post’s text fade out right before the “read more” button?

    I think the original Dyad theme has it set like that, and it looks so pretty with that last line fading out right before the read button

    thank you!

Viewing 1 replies (of 1 total)
  • Siobhan

    (@siobhyb)

    9 years, 10 months ago

    Hi there,

    The fade out effect is a part of the theme’s default design and the following CSS is included in its style.css file in order to create it:

    .too-short .entry-inner-content:before, .too-short .link-more:before {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(100%,rgba(255,255,255,1)));
    background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
    background: -o-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
    background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%);
    bottom: 0;
    content: "";
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 );
    height: 40%;
    left: 0;
    position: absolute;
    width: 100%;
}

    I’m unsure why the above isn’t being applied to your site by default. Could you please share a link to your site so that I can look into this further? (I’m currently being taken to a maintenance page when visiting miscluci.com.)

Viewing 1 replies (of 1 total)

The topic ‘Overflow text fade?’ is closed to new replies.