как исправить сообщение в несколько строк

Question

.abc{
white-space:pre-wrap;
}

<label >student</Label>:<span class="abc">He is a good boy </br> he is also kind'</span>

Скажите, что я отображаю сообщение в приложении Angular в 2 строки1008 * Мне нужно второе сообщение, т.е. он тоже добрый, должен отображаться сразу под первым сообщением, а не под меткой

Answer 1

Этого легко достичь с помощью flexbox . Я воспроизвел демо более здесь .

HTML:

<div class="container">
  <label>student :</label> 
  <div class="information">
    <span>He is a good boy</span>
    <span> he is also kind'</span>
  </div>
</div>

CSS:

.container {
  display: flex; 
  flex-direction: row;
}

.information {
  display: flex; 
  flex-direction: column;
}