CSS&Absolute

by pisuke

HTML

<ul class="level1">
    <li>Link1</li>
    <li>Link2
        <ul class="level2">
            <li>Fear is the path to the dark side<span class="right">></span></li>
            <li>Fear leads to anger<span class="right">></span></li>
        </ul>
    </li>
</ul>

CSS

ul.level1 {
    position: relative;
    border: 1px solid black;
    width: 100px;
}

ul.level2 {
    position: absolute;
    border: 1px solid red;
}

span.right {
    margin-left: 5px;
    border: 1px solid black;
    background-color: yellow;
}

li {
    white-space: nowrap;
    border: 1px solid blue;
    display: flex;
    justify-content: space-between;
}