Author Topic: html/css help?  (Read 332 times)

i've been on this problem for a couple days now and I still can't loving fix it. it works in few cases, and in others not.

my tumblr theme basically has a feature that makes it so that links tilt when you hover over them. however this doesn't appear to be happening with chrome or safari, it only works in firefox and opera. here's the code that controls links:

Code: [Select]
           a:link {
                color:#fff;
                font-style:normal;
                font-weight:bold;
                text-decoration:none;
                text-shadow:0px 0px 10px #ddd;
                
                transform:rotate(0deg);
                -moz-transform:rotate(0deg);
                -webkit-transform:rotate(0deg);
                -ms-transform:rotate(0deg);
                -o-transform:rotate(0deg);
                
                transition:transform 0.3s;
                -moz-transition:-moz-transform 0.3s;
                -webkit-transition:-webkit-transform 0.3s;
                -ms-transition:-ms-transform 0.3s;
                -o-transition:-o-transform 0.3s;
            }
            
            a:link:not(#nospin):hover {
                transform:rotate(-8deg);
                -moz-transform:rotate(-8deg);
                -webkit-transform:rotate(-8deg);
                -ms-transform:rotate(-8deg);
                -o-transform:rotate(-8deg);
            }
            
            a:visited {
                color:#fff;
                font-style:normal;
                font-weight:bold;
                text-decoration:none;
                text-shadow:0px 0px 10px #555;
                
                transform:rotate(0deg);
                -moz-transform:rotate(0deg);
                -webkit-transform:rotate(0deg);
                -ms-transform:rotate(0deg);
                -o-transform:rotate(0deg);
                
                transition:transform 0.3s;
                -moz-transition:-moz-transform 0.3s;
                -webkit-transition:-webkit-transform 0.3s;
                -ms-transition:-ms-transform 0.3s;
                -o-transition:-o-transform 0.3s;
            }
            
            a:visited:not(#nospin):hover {
                transform:rotate(-8deg);
                -moz-transform:rotate(-8deg);
                -webkit-transform:rotate(-8deg);
                -ms-transform:rotate(-8deg);
                -o-transform:rotate(-8deg);
            }

link to the website for testing I guess

i probably forgeted up somewhere but I haven't been able to find any mistakes anywhere :/
« Last Edit: November 07, 2011, 05:37:09 PM by Kingdaro »

I am using Chrome and it works fine. Make sure your versions of Chrome and Safari are completely up to date. They may be outdated and not support some newer CSS/HTML things.

I am using Chrome and it works fine. Make sure your versions of Chrome and Safari are completely up to date. They may be outdated and not support some newer CSS/HTML things.


okay so what the forget.

i'm completely confused now :S

EDIT: i found a beta version and updated to that but it's still not working, in case someone decides to mention it.
« Last Edit: November 07, 2011, 05:46:41 PM by Kingdaro »