将视频嵌入旁边的图片对齐降价文档

Question

我正尝试使用以下语法在我的降价文档中将图像放在YouTube嵌入的视频旁边

<iframe width="450" height="315" src="https://www.youtube.com/embed/2qXhBIHlfaM" frameborder="0" allowfullscreen></iframe>
<img src="/pictures/colour_bar.png" width="200" height="315" align="right" />

事实证明，图像位于视频之下：

有人可以告诉我如何使用html将此图片放在降价文档中的视频旁边吗？

Answer 1

iframe有自己的行的原因是iframe默认为显示：block＆＃39; （并且img元素默认为＆＃39; display：inline＆＃39;）。我建议添加样式/ CSS＆＃39; display：inline-block＆＃39;两个元素，如下：

image = gtk.Image.new_from_file("filename")
button = gtk.Button()
button.add(image)

inner_box = gtk.VBox()
inner_box.pack_start(gtk.Alignment(), True, True, 0)
inner_box.pack_start(button, False, False, 0)
inner_box.pack_start(gtk.Alignment(), True, True, 0)

outer_box = gtk.HBox()
outer_box.pack_start(gtk.Label("some widget"), True, True, 0)
outer_box.pack_start(inner_box, False, False, 0)

如果这不起作用，则页面上可能没有足够的空间让它们彼此相邻。你可以把它们做得更小，如下：

<iframe style="display: inline-block;" width="450" height="315" src="https://www.youtube.com/embed/2qXhBIHlfaM" frameborder="0" allowfullscreen></iframe><img style="display: inline-block;" src="/pictures/colour_bar.png" width="200" height="315" />

祝你好运！

Answer 2

尝试使用HTML表格

<table><tr><td style="width:50%">
<iframe width="450" height="315" src="https://www.youtube.com/embed/2qXhBIHlfaM" frameborder="0" allowfullscreen></iframe></td>
<td style="width:50%">
<img src="/pictures/colour_bar.png" width="200" height="315"/>
</td></tr></table>