图像没有在浏览器窗口大小调整大小 - 由绝对位置引起？

Question

我有一个并排div的网站，其中一个是绝对定位的。绝对定位的div是导航区域，因此设置为在滚动时保持静态（您可以在这里看到它：evanbeltran.com）。

当您单击图像页面时，如果浏览器窗口太小，图像最终会在导航div下面。我已经尝试了最大宽度和高度css，但无论我把它们放在哪里，它们都不会做任何事情。我想知道如何在非绝对定位div中获取图像来调整大小。你可以在这里查看我的意思：http://evanbeltran.com/portsites/vansspace.html

感谢您的帮助。

Answer 1

试试这个：

// Remove the width and margin-right from #content2 then add:

#content2 {
  padding-left: 250px;
}

// Remove the margin-left from .image so it looks like this:
.image {
  width: 100%;
  list-style: none;
  margin: 0 auto;
  margin-top: -130px;
  padding: 10px;
}

// set a max width on your image
.padder {
  padding-bottom: 25px;
  max-width: 100%;
}