在视频库中的单元格之间添加填充

时间:2017-08-04 14:56:01

标签: html

我尝试在以下代码中添加视频之间的填充。任何指针或提示?:



<table width="100%;">
    <tbody>
    <tr>
    <td align="left" valign="top" width="50%">
    <div style="left: 0; width: 100%; height: 0; position: relative; padding-bottom: 56.2493%;"><iframe style="border: 0; top: 0; left: 0; width: 100%; height: 100%; position: absolute;" src="https://www.youtube.com/embed/SxK8XBnYZRk?rel=0&amp;showinfo=0" width="300" height="150" scrolling="no" allowfullscreen="allowfullscreen"></iframe></div>
    <p style="text-align: center;">Battle of Whitehall by <a href="http://www.rockinpaddy.com/">Rockinpaddy</a>, London</p>
    </td>
    <td align="left" valign="top" width="50%">
    <div style="left: 0; width: 100%; height: 0; position: relative; padding-bottom: 56.2493%;"><iframe style="border: 0; top: 0; left: 0; width: 100%; height: 100%; position: absolute;" src="https://www.youtube.com/embed/uS0-xSoxH1o?rel=0&amp;showinfo=0" width="300" height="150" scrolling="no" allowfullscreen="allowfullscreen"></iframe></div>
    <p style="text-align: center;">Which Side Are You On by <a href="http://www.rockinpaddy.com/">Rockinpaddy</a>, London</p>
    </td>
    </tr>
    </tbody>
    </table>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

尝试在td元素上添加一些填充:

td {
  padding: 0 10px;
}
<table width="100%;">
<tbody>
<tr>
<td align="left" valign="top" width="50%">
<div style="left: 0; width: 100%; height: 0; position: relative; padding-bottom: 56.2493%;"><iframe style="border: 0; top: 0; left: 0; width: 100%; height: 100%; position: absolute;" src="https://www.youtube.com/embed/SxK8XBnYZRk?rel=0&amp;showinfo=0" width="300" height="150" scrolling="no" allowfullscreen="allowfullscreen"></iframe></div>
<p style="text-align: center;">Battle of Whitehall by <a href="http://www.rockinpaddy.com/">Rockinpaddy</a>, London</p>
</td>
<td align="left" valign="top" width="50%">
<div style="left: 0; width: 100%; height: 0; position: relative; padding-bottom: 56.2493%;"><iframe style="border: 0; top: 0; left: 0; width: 100%; height: 100%; position: absolute;" src="https://www.youtube.com/embed/uS0-xSoxH1o?rel=0&amp;showinfo=0" width="300" height="150" scrolling="no" allowfullscreen="allowfullscreen"></iframe></div>
<p style="text-align: center;">Which Side Are You On by <a href="http://www.rockinpaddy.com/">Rockinpaddy</a>, London</p>
</td>
</tr>
</tbody>
</table>