div下移

Question

我正在尝试制作动画，以便在iframe源发生更改时将其隐藏，然后再次显示。 问题是，当show被触发时，我的div下移。 我真的不知道该怎么办，我很确定CSS是问题所在。 我的代码在这里： http : //jsfiddle.net/RPxFs/

单击黑色部分以更改源，您将在iframe中看到“找不到页面”，但是无论如何您都会看到问题所在。

提前致谢

Answer 1

我认为它会下降，因为宽度重叠。

div导航和div frame_div

尝试将frame_div的宽度百分比降低到79％，并删除div frame_div样式。

http://jsfiddle.net/vonDy2791/RPxFs/7/

<div src="save.php" id="frame_div" >
#frame_div{
    float: left;
    height: 90%;
    width: 79%;
    border-right: 1px solid #999;
    display: none;
    overflow: hidden
  }

Answer 2

http://jsfiddle.net/RPxFs/19/看看这里，我刚刚添加了

 position: absolute;

用于导航，效果完美

Answer 3

如果给包含div的固定宽度足以容纳导航和iframe，那么它们应该并排放置。

我选择了width: 800px;

请参阅我的小提琴以了解其布置方式。

http://jsfiddle.net/RPxFs/

Answer 4

要解决此问题，请删除此属性float：left;。 从iframe容器下面。

#frame_div {
    border-right: 1px solid #999999;
    display: none;
    float: left;
    height: 90%;
    overflow: hidden;
    width: 80%;
}

如果在这种情况下需要添加float属性 ，则需要提供总计剩余的容器+ iframe容器覆盖的面积，以便并排显示它们。

这是jsfiddle链接http://jsfiddle.net/RPxFs/20/