我选择页面是相对的，但在这里我偶然发现了一个问题，当浏览器恢复时容器和标题的宽度发生变化，但不是段落(id="slogan")。根据浏览器的大小，标语后的点会超过容器的右边框 ( image link )。
非常感谢您对我哪里出错的意见。 谢谢，
@charset "utf-8";
#container {
margin-left: 100px;
margin-right: 100px;
margin-top: 50px;
margin-bottom: 50px;
position: relative;
width: auto;
height: auto;
background-color: #E1E1E1;
border-width: thin;
border-style: solid;
}
#koke {
width: auto;
height: 150px;
border-width: thin;
border-style: dotted;
background-color: #AC9441;
}
#logo {
margin-top: -50px;
}
#slogan {
margin-left: 120px;
position: relative;
}<body>
<div id="container">
<header id="koke">
<p id="slogan">
Slogan .............................................................................................
</p>
<img src="img205.jpg" alt="" width="100" height="120" id="logo" />
</header>
<nav id="menu">
<p>Menu | Menu | Menu</p>
</nav>
<main id="main">Content.....</main>
</div>
</body>最佳答案
你可以在CSS中添加:
#koke p{
overflow-wrap: break-word;
}
这将强制段落文本在该标题部分换行
关于html - 相关网站布局不适用于段落，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41978271/