javascript - 如何使 div 调整包含内容的高度？

Question

我有一个“maincontent”div，其中包含我的内容。其中有一些 javascript (Fancybox) 来显示图像。我试图让 div 的高度自动更改以伴随其中的任何内容，以便 div 本身不会滚动，但整个网页会滚动。

这是我要修复的页面:http://willryan.us/content/photo.html

我试过修改 min-heights、height:auto、overflow:auto 等，但没有结果。 Height:auto 认为文本是 div 中唯一的东西，就像它完全忽略了 javascript 图像一样。

这是我现在的 CSS:

div#content {
overflow:auto;
width:958px;
height: 800px;
position:absolute;
top:50px;
left:0px;
background-color:#C0CACE;

border:1px solid;
border-color:#616161;

-webkit-box-shadow:  0px 0px 50px 0px rgba(0, 0, 0, 1);
box-shadow:  0px 0px 50px 0px rgba(0, 0, 0, 1);
z-index:1;

Answer 1

问题与 photobox div 有关，如果你关闭绝对位置，它会工作到它的高度，关闭高度并且它适合。

如果你在不需要的时候不使用绝对定位，这个问题是可以避免的。

您应该使用相对定位重建您的页面。考虑到您只需要将使用 text-align:center; 的 div 居中放在它们的父元素上，这应该很容易。