内容移动浏览器高度更改

Question

我最近在响应式网页设计方面做了很多工作，而且我遇到了一些问题。我有一个单页的网站，我目前有2个部分（页面），第一个是介绍，第二个是关于我＆＃34;。现在，我有几个朋友在他们的计算机上访问我的网站（1个是笔记本电脑，屏幕高度与我的24 BenQ相比非常低）我想问我如何使我的内容保持静态，所以介绍并不是＃39;有点消失在＆＃34;关于我＆＃34;部分。

 .intro-container
{
    width: 70%;
    letter-spacing: .2em;
    height: 100%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
#ContentWrap-2-about
{
    width: 100%;
    height: 50%;
    background-color: rgb(255, 255, 255);
}

这些是以错误的方式进行交互的包装器。您可以访问www.old.vhammershoi.dk并缩小浏览器以查看带有箭头的框（单击并浏览弹出窗口）将在“关于我”部分下方移动

提前谢谢

Answer 1

首先，不需要自定义高度。您已使用overflow: hidden将高度设置为元素，并且由于内容长于元素，因此按下按钮。从所有主要元素中删除高度，同时从intro容器中删除边距。这样，按钮将可见，并且渲染页面将与没有更改（除了可见按钮）

相同

Answer 2

尝试使用其中一个将DIV（介绍容器）修复到屏幕顶部。

position:fixed; position:static; position:absolute;

以下是一个工作示例：http://jsfiddle.net/19Lhchyy/1/

使用postition:fixed;

http://www.w3schools.com/cssref/pr_class_position.asp

Answer 3

#ContentWrap {
    min-height: 100%:
    padding-bottom:30px;
}
#clickAndExploreText{
    position: absolute;
}

我不知道是否能够定位它，但如果你不这样做，你的容器会在悬停时生长 然后，您的文本“点击和浏览”将永远不会出现在以下容器中。 另外，您在移动版本中遗漏了一些white-space:nowrap，以防止标题的换行和“点击和探索”