2013-01-21 9 views
7

私はこの星を中心に回転させようとしています。今のところ、それは別のポイントの周りを回転します。星はその中心の周りに回転するので、私はそれを修正するにはどうすればよいセンター周りを☆スピンする方法は?

http://dharman.eu/test/test3.php

#question { 
    animation: 1s linear 0s normal none infinite spin; 
    display: block; 
    width: 0; 
} 

@-moz-keyframes spin { 
    from {-moz-transform: rotate(00deg); } 
    to {-moz-transform: rotate(360deg);} 
} 

+3

+1のために: –

答えて

3

デフォルトのtransform-originは、50% 50%です。これはあなたが望むものです。

ただし、幅を0に設定すると、水平方向に約0回転します。

要素を内容と同じ大きさにする必要がありますし、内容を内容の中心に合わせる必要があります。

あなたの例では、inline-blockに要素を設定し、width:0を削除するだけでほとんど問題は解決します。

+0

Thx man、私は 'padding-bottom:9px'も追加しなければならなかった – Dharman

関連する問題