在wordpress中并排对齐iframe答案

【问题标题】：Aligning iframes side by side in wordpress在wordpress中并排对齐iframe
【发布时间】：2017-04-26 02:51:41
【问题描述】：

我在一个 wordpress 网站上有两个 iframe，使用 211 主题，但无法让它们彼此对齐！它们似乎是垂直堆叠的，其他元素也会发生这种情况！这是 iframe 的 html..

<iframe src="myfirstframe" width="290" height="375" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>


<iframe src="mysecondframe" height="470" width="640" frameborder="0" scrolling="no"></iframe>

我尝试过 div 并在 wordpress 中的 css 中向左浮动但无济于事这是 wordpress 中当前的 css....

#page {
      width: 1060px;
}

#content {
     width:  620px;
}

【问题讨论】：

标签： html css wordpress

【解决方案1】：

将它们包装在一个容器中。并使用下面的css

<div class="iframe-cont">
<iframe src="myfirstframe" width="290" height="375" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>


<iframe src="mysecondframe" height="470" width="640" frameborder="0" scrolling="no"></iframe>
</div>


.iframe-cont {
  display: flex;
}

你可以用这个改变它们的宽度和高度

    .iframe-cont > iframe {
      height: ;
      width: ;
/**display: inline-block;**/
    }

【讨论】：

你的意思是包装在一个 div 容器中，即
到达那里！只有我需要他们保持当前的宽度和高度！当我使用您建议的代码时，它们的宽度/高度相同，当我更改一个时，它会影响另一个 iframe
我建议过，但如果您需要，则无需更改它

【解决方案2】：

您的页面是否足够宽？看看这个 sn-p，按计划工作 - 否则你可能有一些其他 css 导致问题

iframe {
  border: 1px solid red;
}

<iframe src="#" width="20" height="60" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>
<iframe src="#" height="60" width="40" frameborder="0" scrolling="no"></iframe>

【讨论】：

这只是在 iframe 周围放置了一个红色边框！他们仍然堆叠在一起
他们在我身边