Новая строка в подсказке Buefy

Question

Я хочу отобразить текст, который должен содержать пару новых строк в качестве текста всплывающей подсказки.

<b-tooltip label="Item 1 \r\n Item 2 \r\n Item 3" size="is-small" type="is-light" position="is-top" animated multilined>
  <b-button type="is-primary" size="is-large" icon-left="compact-disc">
      Action
  </b-button>
</b-tooltip>

Новые строки, использующие \r\n или <br>, не работают.

Как я могу наложить новую строку на этот элемент?

Было бы лучше иметь правильное html содержание в качестве всплывающей подсказки, но в настоящее время Buefy не поддерживает его.

Редактировать :

Answer 1

Измените css пробел на pre или pre-wrap:

.b-tooltip:after {
  white-space: pre !important;
}

И используйте 
 вместо \n

  <b-tooltip label="Item 1 &#xa; Item 2 &#xa; Item 3" size="is-small" type="is-light" position="is-bottom" animated multilined>
    <b-button type="is-primary" size="is-large" icon-left="compact-disc">
      Action
    </b-button>
  </b-tooltip>

См .: https://codepen.io/hans-felix/pen/xxwggad