html - 为什么我的网页上的文字在缩小时不会留在原处？

Question

网络开发者。菜鸟在这里!在 Chrome 中，当我缩小这个 page 时, 文本会被挤到 Angular 落里。虽然我使用 Safari 时不会发生这种情况。我假设这是一个 CSS 问题和/或我将其输入 HTML 的方式。我把它放在 jsfiddle here 上了.

.second {
font-family: helvetica neue, arial, sans-serif;
font-size: 30px;
font-weight: lighter;
line-height: 5px;
position: relative;
top: 5px;
width: 500px;
margin-left: -330px;

}

.third {
font-family: helvetica neue, arial, sans-serif;
font-size: 40px;
font-weight: lighter;
line-height: 0px;
position: relative;
top: 5px;
margin-bottom: 70px;
width: 500px;
margin-left: -330px;
}

.fourth {
font-family: helvetica neue, arial, sans-serif;
font-size: 20px;
font-weight: lighter;
line-height: 0px;
position: relative;
top: 30px;
width: 500px;
margin-left: -335px;
background-color: white;


<p class="second"><b>Barter</b> a textbook <b>you have</b></p>
<p class="second">for a textbook <b>you want</b></p>
<p class="second">with a fellow <b>Aggie</b> on campus,</p>
<p class="third"><b><i>now</i></b>.</p> 

Answer 1

margin-left: -330px;

因为您使用的是负边距，这就是它隐藏在屏幕中的原因

而且您的链接在我的 chrome 中运行良好