<div>
<my-element>
<p>
Slotted content
</p>
</my-element>
</div>
p {
margin: 0;
}
import {
LitElement,
html,
css
} from "https://cdn.skypack.dev/lit-element@2.4.0";
window.customElements.define(
"my-element",
class extends LitElement {
static get styles() {
return css`
div {
border: 1px solid red;
}
p {
margin: 0;
}
`;
}
render() {
return html`
<div>
<p>Inner content</p>
</div>
<div>
<slot></slot>
</div>
`;
}
}
);
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.