Css文本定位不正常

嗨，這是我的代碼JsFiddle。我的文本定位工作不正常。現在默認的文本對齊是正確的，它工作正常，但當我改變到中心或左側，那麼它是不正確定位我在我的代碼中缺少什麼？Css文本定位不正常

#headline1Txt, #headline2Txt, #headline3Txt 
{ 
    text-align:right; 
    position: relative; 
    top:60px; 
    left: -160px; 
    width: 140px; 

}

來源

2014-06-11 user3718016

它在我身邊的chrome瀏覽器工作正常。您正在使用哪個瀏覽器？ –

它在Chrome瀏覽器和Firefox上都能正確定位。你究竟發生了什麼？ – Locke

好的，我現在再解釋一下text-align：right;這是好的，文字是動畫的權利，但我把它改爲文本對齊：左;那麼它會添加一些填充，而不是在最左邊。現在清楚了嗎？ – user3718016

檢查此琴鏈接here

腳本

function bannerAnimation(){ 
    //Jquery Animation 
    $("#headline1Txt").animate({ left: "20" }, 700, function() { 
     $("#headline1Txt").animate({ left: "0", right:"0" }, 350); 
    }); 

    setTimeout(function() { 
     $("#headline2Txt").animate({ left: "20" }, 700, function() { 
      $("#headline3Txt").animate({ left: "20" }, 700, function() { 
       $("#headline3Txt").animate({ left: "0", right:"0" }, 350); 
      }); 
      $("#headline2Txt").animate({ left: "0", right:"0" }, 350); 
     }); 
    }, 1000); 
}

CSS

#headline1Txt, #headline2Txt, #headline3Txt 
{ 
    text-align:center; 
    position: relative; 
    top:60px; 
    left: -160px; 
    width: auto; 
}

來源

2014-06-11 05:13:25 Rohith

它不是正確的動畫。你的位置很好，但不是原來的動畫 – user3718016

謝謝Rohith你能告訴我我做錯了什麼嗎？ – user3718016

請解釋一下問題所在以及解決方法如何解決它 – andyb

是不是你在找什麼：LINK

CSS：

#headline1Txt, #headline2Txt, #headline3Txt { 
    text-align:center; 
    position: relative; 
    width: 140px; 
    top:60px; 
}

來源

2014-06-11 04:57:01

感謝kiran，但我不是在尋找這個我的路線有問題。默認情況下，我使用的權利，它是動畫到極端的權利，但如果我改變它左邊，那麼它會添加一些填充或邊距，並不會動畫到極端的左側 – user3718016

@ user3718016你想要這樣嗎？ [** fiddle **]（http://jsfiddle.net/venkateshwar/VgBPg/9/） –

是的，我正在尋找這個東西 – user3718016

Css文本定位不正常

回答

相關問題