고르지 않은 높이의 테이블

Question

HTML 테이블에서이 문제가 발생했습니다. 왼쪽 열에는 3 개의 행이 있어야합니다 (아래에서 보는 이미지에서 그냥 놀고있었습니다). 바로 1입니다. 왼쪽 열의 첫 번째 행 왼쪽 위 모서리에 텍스트를 배치하고 싶습니다. 텍스트를 배치 할 수는 있지만 왼쪽 상단에 없습니다.

<table border="1"> 
 
    <tbody> 
 
    <tr> 
 
     <td style="width: 50%;">a</td> 
 
     <td style="width: 50%;" rowspan="7"><img src="http://chorix.be/wp-content/uploads/2017/02/Achtergrond.gif" alt="" width="570" height="570" class="alignnone size-full wp-image-378" /></td> 
 
    </tr> 
 
    <tr> 
 
     <td style="width: 50%;">a</td> 
 
    </tr> 
 
    <tr> 
 
     <td style="width: 50%;">a</td> 
 
    </tr> 
 
    <tr> 
 
     <td style="width: 50%;">a</td> 
 
    </tr> 
 
    <tr> 
 
     <td style="width: 50%;">a</td> 
 
    </tr> 
 
    <tr> 
 
     <td style="width: 50%;">a</td> 
 
    </tr> 
 
    <tr> 
 
     <td style="width: 50%;">a</td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 
<p>&nbsp;</p>

이 사람이 나를 도울 수 :

이 내 코드?

Answer 1

나는 당신이 찾고있는 것이 vertical-align이라고 생각합니다. 기본적으로이 표 셀에 대한 middle로 설정되어 있지만 top으로 설정할 수 있습니다 :

<td style="vertical-align: top"> ... </td> 

<table border="1"> 
 
    <tbody> 
 
    <tr> 
 
     <td style="width: 50%; vertical-align: top;">a</td> 
 
     <td style="width: 50%;" rowspan="7"><img src="http://chorix.be/wp-content/uploads/2017/02/Achtergrond.gif" alt="" width="570" height="570" class="alignnone size-full wp-image-378" /></td> 
 
    </tr> 
 
    <tr> 
 
     <td style="width: 50%;">a</td> 
 
    </tr> 
 
    <tr> 
 
     <td style="width: 50%;">a</td> 
 
    </tr> 
 
    <tr> 
 
     <td style="width: 50%;">a</td> 
 
    </tr> 
 
    <tr> 
 
     <td style="width: 50%;">a</td> 
 
    </tr> 
 
    <tr> 
 
     <td style="width: 50%;">a</td> 
 
    </tr> 
 
    <tr> 
 
     <td style="width: 50%;">a</td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 
<p>&nbsp;</p>