我的目标是它只是适应显示分辨率并允许垂直滚动。我已经尝试了几个视口组合和CSS文本换行选项椭圆等没有改变...也许我太愚蠢,看到我犯的错误...继承人html:
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>xx xxxxxxxxxxxxx</title>
<style>
html {
background-color:#434c53;
}
/* unvisited link */
a:link {
color: #777777;
text-decoration: none;
}
/* visited link */
a:visited {
color: #777777;
text-decoration: none;
}
/* mouse over link */
a:hover {
color: #0071CE;
text-decoration: none;
}
/* selected link */
a:active {
color: #0071CE;
text-decoration: none;
}
@font-face {
font-family: 'Conv_Calibri';
src: url('fonts/Calibri.eot');
src: local('☺'), url('fonts/Calibri.woff') format('woff'), url('fonts/Calibri.ttf') format('truetype'), url('fonts/Calibri.svg') format('svg');
font-weight: normal;
font-style: normal;
text-decoration: none;
}
#Wrapper {
max-width: 1280px;
min-width: 960px;
min-height: 960px;
max-height: 1280;
background-color: #E7E9EA;
margin: 0 auto;
opacity: 0.93;
}
header {
height:240px;
background-color: #E7E9EA;
}
#MainNav {
display: -webkit-flex;
display: flex;
-webkit-align-items: center;
align-items: center;
background-color:#E7E9EA;
-webkit-justify-content: space-around;
justify-content: space-around;
padding-top: 36px;
font-family:'Conv_Calibri',Sans-Serif;
font-size: 100%;
}
#Content {
display: -webkit-flex;
display: flex;
padding: 80px;
max-width: 1280px;
min-width:960px;
font-family:'Conv_Calibri',Sans-Serif;
font-size: 160%;
}
#footer {
display: -webkit-flex;
display: flex;
max-width: 1280px;
min-width:960px;
margin: 0 auto;
background-color: #E7E9EA;
-webkit-justify-content: space-around;
justify-content: space-around;
font-family:'Conv_Calibri',Sans-Serif;
color:#777777;
font-size: 100%;
}
</style>
</head>
<body>
<div id="Wrapper" >
<header>
<nav id="MainNav">
<img src="dp_logo.svg" width="240" height="auto"
</img>
<a href="index.html">Home</a>
<a href="about_us.html">Über uns</a>
<a href="solutions.html">Lösungen</a>
<a href="contact.html">Kontakt</a>
</nav>
</header>
<div id="Content" >
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet,</p>
</div>
</div>
<div id="footer">
<section>
<p>
© xxx xxxxxxxxx xxxxxx
</p>
</section>
<section>
<p>
xxxxxxxxxxxxxxxxxxxxxxxx
xxxxxxxxxxxxxx
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
</p>
</section>
<section>
<p>
<a href="impressum.html">Impressum</a>
</p>
</section>
</div>
</body>
</html>
我犯了什么错误?