Grow your CSS skills. Land your dream job.

CSS Trick: Fade Out Bottom (for WP widget)…

  • # March 11, 2010 at 2:04 pm

    Greetings!

    I`m trying to add the CSS trick called `Fade Out Bottom` ( http://css-tricks.com/examples/FadeOutBottom/ ) to a WordPress/ComicPress widget called `Scheduled Posts` (not to the whole page on my blog). This way, my future posts `fade` towards the bottom. However, I`m unable to get this to work. You can see the widget (titled `Sneak Peek) at the top of my right-sidebar at ( http://www.dollopsofirony.com/51/floatation-device/ ).

    According to CSS-tricks.com: `This can be achieved with a transparent image that is in a fixed position on the page, like so`:

    Code:
    [size=150]#bottom_fade {
    z-index: 99;
    position: fixed;
    bottom: 0%;
    background-image: url(“bottom-fade.png”);
    }[/size]

    …`The high z-index helps insure it is the top-most layer.`

    I`ve uploaded the PNG image to: url (`/images/bottom-fade.png`), but have no idea how/where to add the CSS code to the widget itself. Does anyone know how to do this?

    Any help would be greatly appreciated!

    Thanks!

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".