如何停止html / css中的重叠文本？

Question

当我最小化窗口时，我的文字会重叠到我网站的另一部分。我该如何阻止呢？我不是很擅长编码，但更多的是3D人。这是课堂作业。

This is an image of my screen/window

Is ther also a way to format the sides of my text paragraphs?

Download my code here.

Answer 1

文本重叠（应称为“溢出”）到另一部分的原因是因为您为about和service部分的高度值分别设置为90vh和85vh。当您最小化窗口时，about部分的高度仍将保持为视口高度的90％，而服务部分的高度仍将为视口高度的85％。当高度不足以容纳文本时，文本会溢出到另一部分。删除您的style.css中的下面的height:90vh;和height:85vh;将解决问题：

    /****************About Section***************/
    .sec-about {
      color: #FFF;
      font-color:#000; 
      font-size: 16px;
      height:90vh; /*Section Size*/ /*REMOVE THIS LINE */
    }
    /****************Service Section***************/
   .sec-service {
     color: #900;
     font-color:#000; 
     font-size: 16px;
     height:85vh; /*fit screen*/ /*REMOVE THIS LINE AS WELL*/
   }

对于第二个问题，请根据需要使用CSS代码text-align: justify;使段落的两边“笔直”。

将此代码块添加到您的style.css文件：

.container__text p{
    text-align: justify;
}