So I read up tutorials on how to create a "Rollover" button for you wiki and that is through CSS. Problem is, when I tried to do exactly those tutorials told me to do, it's not working. I tried making my own custom class, but it wouldn't work.
This is what I tried to put on the wiki. Can anybody tell me what am I doing wrong?
a.cardbox { display: block; width: 200px; height: 60px; cursor: pointer; text-indent: 9999px; background-position: 0 0; background-repeat: no-repeat; background: url('vignette1.wikia.nocookie.net/aikatsustars6864/images/1/1c/Cardbox_Silver_Button.png/revision/latest?cb=20160421123700'); } a.cardbox:hover { background: url('vignette3.wikia.nocookie.net/aikatsustars6864/images/f/f8/Cardbox_Silver_Button_(hover).png/revision/latest?cb=20161204113157'); } a.cardbox:active { background: url('vignette4.wikia.nocookie.net/aikatsustars6864/images/1/10/Cardbox_Silver_Button_(active).png/revision/latest?cb=20161204113157'); }
And this is what I tried to do to test it
{{#if: {{{coord-set}}} | <a href="aikatsustars.wikia.com/wiki{{{coord-set|}}}" class="cardbox"></a> | <span style="cursor:not-allowed">[[File:Cardbox Silver Button.png|link=]]</span>}}