루비 있을 때 자막이 내려가요

<img src="https://t1.daumcdn.net/cfile/cafe/2765393F55AF741F21" class="txc-image" hspace="1" vspace="1" border="0" actualwidth="1024" width="1024" exif="{}" data-filename="11.png" style="clear:none;float:none;" id="A_2765393F55AF741F21C11E"/> <img src="https://t1.daumcdn.net/cfile/cafe/2562F93F55AF742123" class="txc-image" hspace="1" vspace="1" border="0" actualwidth="1024" width="1024" exif="{}" data-filename="12.png" style="clear:none;float:none;" id="A_2562F93F55AF7421234D3B"/> <img src="https://t1.daumcdn.net/cfile/cafe/275ADB3F55AF74232A" class="txc-image" hspace="1" vspace="1" border="0" actualwidth="1024" width="1024" exif="{}" data-filename="23.png" style="clear:none;float:none;" id="A_275ADB3F55AF74232AC59B"/> <img src="https://t1.daumcdn.net/cfile/cafe/2115223F55AF742505" class="txc-image" hspace="1" vspace="1" border="0" actualwidth="1024" width="1024" exif="{}" data-filename="24.png" style="clear:none;float:none;" id="A_2115223F55AF7425051141"/> HTML 편집이 가능하면 마우스 오버 해서 이미지 바꾸게 할 수 있는데 안 됩니다. 받아서 보면 차이를 쉽게 느낄 수 있습니다. 처음 이미지를 보면 루비 때문에 자막이 밑에 있다가 두번째 이미지에서 루비가 사라지면서 자막이 올라옵니다. 세네번째는 반대입니다. 아마 http://cafe.daum.net/pot-tool/AZMV/11069 이 글이랑 비슷한 문제 같습니다. 이걸 루비 태그가 나와도 자막의 위치가 변하지 않게 할 수 있나요? 자막의 해당 부분 첨부합니다. <Sync Start=212463>[파르스국 <ruby>만기장<rt>(마르즈반)</rt></ruby> / 칼란] 전하께 있어서는 첫 출진이니 무리도 아니지요<Sync Start=216081>전하께 있어서는 첫 출진이니 무리도 아니지요 <Sync Start=210744>칼란……<Sync Start=212004>[파르스국 <ruby>만기장<rt>(마르즈반)</rt></ruby> / 칼란] 칼란……