Styling/layout for child elements of web component

Viewed 9

I am creating list-style component where the component itself doesn't know the children of its child elements.

Using the standard <ul> element as an example:

<ul>
  <li><div>Part 1</div><div style="margin-left: 10px">[Part 2]</div></li>
  <li><div>Part 1</div><div style="margin-left: 10px">[Part 2]</div></li>
  <li><div>Part 1</div><div style="margin-left: 10px">[Part 2]</div></li>
</ul>

So I'd expect my list element to layout and style each <li>, as that is part of the API, but not the contents.

How does one achieve this with web components/lit-element?

0 Answers
Related