代码之家  ›  专栏  ›  技术社区  ›  Aparna

在角度上,当打印太长的文本时,会覆盖文本而不转到下一行

  •  0
  • Aparna  · 技术社区  · 6 年前

    所以我有下面的html代码

    <div class="equipment-utilization-chart" >
    <ng-container *ngIf="data.healthRecco1 !== ''" >
          <div class="recommendations"> <p> 1. {{data.healthRecco1}}</p> </div>
          <div class="recommendations"><p> 2. {{data.healthRecco2}}</p></div>
          <div class="recommendations"><p>3. {{data.healthRecco3}}</p></div>
      </ng-container>
    </div>
    

    以下是.scss文件中的代码

    .equipment-utilization-chart {
      left: rem(444);
      width: rem(682);
      height: rem(85);
      line-height: 0;
    
     .recommendations {
    width: auto;
    height: auto;
    margin-top: 35px;
    word-wrap : break-word;  }
    

    }

    我该怎么做才能让文字换行到下一行。任何帮助都将不胜感激。

    3 回复  |  直到 6 年前
        1
  •  2
  •   JAK    6 年前

    您的问题似乎是由于您使用 line-height: 0;

    我希望这个小小的代码笔能帮助解释发生了什么:

    https://codepen.io/ojako/pen/rZRvpW

        2
  •  0
  •   Nemanja G    6 年前

    尝试使用单词包装和空白,在css中,尝试控制台什么工作。

        3
  •  0
  •   Sachin Shah    6 年前

     .recommendations {
        width: auto;
        height: auto;
        margin-top: 35px;
        word-wrap: break-word;
      }