애니메이션이 진행될 때 요소가 움직이지 않습니다.

저는 CSS와 JS를 배우고 있습니다. 그리고 텍스트의 첫 부분이 애니메이션으로 나타나고 두 번째 부분이 움직이지 않는 텍스트 줄을 만들려고합니다. 나는 그것을한다, 두 번째 텍스트 움직임은 첫번째 변경을 초래한다.애니메이션이 진행될 때 요소가 움직이지 않습니다.

HTML은 :

는

<div class="AnimatedText"><span class="wiggle1">F</span><span class="wiggle2">i</span><span class="wiggle3">r</span><span class="wiggle1">s</span><span class="wiggle2">t</span><span class="wiggle3">T</span><span class="wiggle1">e</span><span class="wiggle2">x</span><span class="wiggle3">T</span><span class="text1"> second text.</span> 
</div>

CSS : 나는 절대 두 번째 텍스트의 위치를 설정 않았다

.AnimatedText { 
    width: 100%; 
    background-color: #ff0000; 
    text-align: center; 
    color: white; 
    } 

.wiggle1 { 
    -webkit-animation: mymove 1s linear; 
    animation: mymove 1s linear; 
    -webkit-animation-iteration-count: infinite; 
    animation-iteration-count: infinite; 
    position: relative; 
    vertical-align: middle; 
} 

.wiggle2 { 
    -webkit-animation: mymove1 1s linear; 
    animation: mymove1 1s linear; 
    -webkit-animation-iteration-count: infinite; 
    animation-iteration-count: infinite; 
    position: relative; 
    vertical-align: middle; 
} 

.wiggle3 { 
    -webkit-animation: mymove2 1s linear; 
    animation: mymove2 1s linear; 
    -webkit-animation-iteration-count: infinite; 
    animation-iteration-count: infinite; 
    position: relative; 
    vertical-align: middle; 
} 

.text1 { 
    position: absolute; 
} 

@-webkit-keyframes mymove { 
    0% {font-size: 100%;} 
    25% {font-size: 120%;} 
    50% {font-size: 140%;} 
    75% {font-size: 130%;} 
    100% {font-size: 100%;} 
} 

@-webkit-keyframes mymove1 { 
    0% {font-size: 120%;} 
    25% {font-size: 140%;} 
    50% {font-size: 120%;} 
    75% {font-size: 100%;} 
    100% {font-size: 120%;} 
} 

@-webkit-keyframes mymove2 { 
    0% {font-size: 140%;} 
    25% {font-size: 120%;} 
    50% {font-size: 100%;} 
    75% {font-size: 120%;} 
    100% {font-size: 140%;} 
}

DEMO

는, 다음은 고정 된 수직 위치로 결과 그러나 그것은 여전히 옆으로 간다. 두 번째 텍스트를 이동하지 않고 동일한 위치에 머물게하려면 어떻게해야합니까?
감사합니다.

출처

2017-05-08 Dédi