0

长期的 Java 程序员，对 CSS/HTML 很陌生。这是我正在开发的投资组合网站。

www.zdware.com/projects.html

使用非大浏览器窗口访问它会迫使我的内容溢出到另一个 div 中。目前，我为其添加了一些填充，因此它并没有完全溢出，但现在内容被向下推（出于某种奇怪的原因，即使似乎有空间。

我正在使用一些“hackish”的东西来有点像：

margin-bottom: -10000px;
padding-bottom: 10000px;

对于我中间的两个“列”。这和它有什么关系吗？

我的两列都受此影响。

.sidebar1 {
    float: left;
    min-height: 100%;
    min-width:250px;
    width: 20%;
    background-color:gray;
    margin-bottom: -10000px;
    padding-bottom: 10000px;
}
.content {
    padding: 10px 0;
    width: 80%;
    float:right;
}

.content section{
    padding-left:30px;
}

我尝试将 min-width 添加到 .content，但它并没有真正做任何事情。我在页面上确实有更大的图像，但它们应该仍然适合。

视觉上详细说明..

当浏览器窗口不大（小于 17-18 英寸显示器全屏）时会发生什么

大浏览器窗口的外观..预期外观

我希望这个工作的首选方式是缩短非“容器”部分（包含侧边栏和内容标签），而不是容器。

我也觉得这是一个普遍的问题。但是，处理 CSS 的方式时，我觉得如果我实现了其他人的解决方案（基于他们自己的问题），另一段代码最终会阻止它工作。

4

1 回答 1

1

min-width: 250px;规则.sidebar1是导致div将.content自身定位在侧边栏下方的原因。如果你摆脱它，那么你的内容列就会移动到正确的位置。

至于如何处理徽标，我要么将其向下撞以使其适合该空间，要么将其设置为在 css 中具有百分比宽度，因此无论该列有多宽，它始终适合该列。

是的，我会失去 10000px 负边距黑客。

于 2012-10-11T02:06:07.183 回答