設置`​​`包含視頻細胞自動縮小以適合

Question

我想我的頁面的佈局看起來像這樣：

Heading  | video 
text text text | video 


video | Heading 
video | text text text 

Heading  | video 
text text text | video 

的視頻都是一樣的大小，而不應採取了整整一半的表格行。然而，天真地使用<table>，使細胞平分攔腰：

我怎樣才能得到包含視頻細胞萎縮，從而使文本是寬越好？不是說這意味着列分隔符不會在行之間對齊，儘管它們應該在每兩行之間對齊。同樣，這些視頻的尺寸都是相同的。如果這是一個問題，我很抱歉，我沒有web開發經驗。下面是我使用的代碼：

<table cellspacing="50"> 
     <tr> 
     <td valign="top" > 
      <h2>Heading 1</h2> 
      <p> 
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. 
      </p> 
     </td> 
     <td> 
      <video autoplay loop> 
      <source src="video/video1.mp4" type="video/mp4"> 
      </video> 
     </td> 
     </tr> 
      <tr> 
     <td> 
      <video autoplay loop> 
      <source src="video/video2.mp4" type="video/mp4"> 
      </video> 
     </td>   
     <td> 
      <h2>Heading 2</h2> 
      <p> 
      Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. 
      </p> 
     </td> 

     </tr> 
    </table> 

Answer 1

原來這很容易使細胞跨越與合併單元格屬性列。所以我只是說colspan="2"到文本的單元格，然後在底部添加一行：

<tr> 
     <td width="25%"></td> 
     <td width="50%"></td> 
     <td width="25%"></td> 
    </tr> 

因此視頻總是會25%寬度，文字永遠是75%寬度。