MyBB Community Forums

Full Version: Help me with CSS3!
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Okay, so I'm trying to add a transition to certain group's styles on The Sonic Station (namely those whose usernames have the text-shadow property) that effectively removes the shadow on hover, albeit with a transition out rather than them abruptly vanishing. The problem is, it's not working and I'm not sure if it's just me failing at CSS.

Here's my class:

.admin
{

/* Transitions. */
	transition: all 500ms linear 500ms;
        -o-transition: all 500ms linear 500ms;
        -moz-transition: all 500ms linear 500ms;
        -webkit-transition: all 500ms linear 500ms;

/* Colors and shadows */
        color: #0000cc;
	text-shadow: 0 0 5px #0000cc;
}

.admin:hover admin:active
{

/* Transitions. */
	transition: all 500ms linear 500ms;
        -o-transition: all 500ms linear 500ms;
        -moz-transition: all 500ms linear 500ms;
        -webkit-transition: all 500ms linear 500ms;

/* Transparency (doing this right instead of using CSS2 hacks!) */
        opacity: .75;
        -o-opacity: .75;
        -moz-opacity: .75;
        -webkit-opacity: .75;

/* Finally, colors and shadows */
        color: #0000cc;
}

However, the above code at the end of global.css doesn't seem to be working; the transition doesn't actually play.

HELP MEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEE :V
.admin {

/* Transitions. */
    transition: all 500ms ease-in-out 500ms;
        -o-transition: all 500ms ease-in-out 500ms;
        -moz-transition: all 500ms ease-in-out 500ms;
        -webkit-transition: all 500ms ease-in-out 500ms;

/* Colors and shadows */
        color: #0000cc;
    text-shadow: 0 0 5px #0000cc;
}

.admin:hover, admin:active {

/* Transparency (doing this right instead of using CSS2 hacks!) */
        opacity: .75;
        -o-opacity: .75;
        -moz-opacity: .75;
        -webkit-opacity: .75;

/* Finally, colors and shadows */
        color: red;
        text-shadow: 0;
}
Thanks Jason, that fixed it!
(2012-12-24, 07:08 PM)StingReay Wrote: [ -> ]Thanks Jason, that fixed it!

Wink
Hilariously enough, I fixed an error in your version earlier.

text-shadow: 0;

should have been

text-shadow: none;