마지막 행에 이미지 단추 옆에 텍스트가 표시되는이 간단한 테이블이 있습니다. 이것은 IE7을 제외한 다른 브라우저에서도 잘 작동합니다. CSS 파일에서IE7 테이블 셀의 단추 옆에 텍스트 정렬
<table>
<tr>
<td>Some header</td>
<td>Some other header</td>
</tr>
<tr>
<td colspan="2" class="infoRow">Info:
<input type="image" class="infoButton" src="Images/down_arrow.png" /></td>
</tr>
</table>
:
.infoButton
{
float: right;
padding: 0;
margin-left: 20px;
}
.infoRow
{
text-align: right;
}
IE7은 모든 방법 테이블 셀의 오른쪽 이미지 버튼에 텍스트를 표시는 아래도 오른쪽으로 정렬됩니다. 다른 브라우저에서 제대로 작동하는 이미지 버튼의 왼쪽에있는 "정보 :"텍스트를 표시하고 싶습니다.
을 위해 작동 할 라벨 태그
<label>info<label/>
에 귀하의 정보 텍스트를 넣어하는 것이 좋습니다! 고마워. 그러나 이제 텍스트는 이미지 버튼 옆에 세로로 가운데에 정렬되지 않습니다. 나는 이미지의 수직 중심에 텍스트를 놓는 "vertical-align : top"을 시도했다. Chrome에서는 작동하지만 IE에서는 작동하지 않습니다. 젠장 –@ OliverNilsen, [this] (http://css-tricks.com/centering-in-the-unknown/)을보십시오. –
'td'에'세로 정렬 : 중간 '이 효과가 있다고 생각합니다. – powerbuoy