break tag is not working in an HTML in a string template literal tagged with the `html`

67 views Asked by At

This is a sample code where I am trying to add a break tag
and \n inside the string for the newline but it is not working in the code.

I also tried with \n but this is also not working

Sample code:

import {html, css, LitElement} from 'lit';
import {customElement, property} from 'lit/decorators.js';

@customElement('simple-greeting')
export class SimpleGreeting extends LitElement {
  static styles = css`p { color: blue }`;

  @property()
  message = 'Hello!<br /> How are you?';

  render() {
    return html`<p>${this.name}!</p>`;
  }
}

Output: Hello! <br /> How are you?!

Expected output:

Hello!
How are you?!

0

There are 0 answers