Align li inside ul to the bottom

user_5649135 0
Viewed 15568

I have a li element inside a ul list that I wish to align to the bottom.

+------+
| li1  |
| li2  |
| li3  |
|      |
|      |
|      |
| li4  |
+------+

How can I do this?

WHAT I HAVE TRIED: 

li4 {
  position: fixed;   
  bottom: 0;
}

This moved the li4 to the bottom. However, since the ul is inside a hidden menu, li4 will appear even if I close the menu (this is not what I want) because of the position: fixed

css html
6 Answers

Just use fixed-bottom

<li class="nav-item px-3 fixed-bottom">
        <NavLink class="nav-link" href="" Match=NavLinkMatch.All>
            <span class="oi oi-arrow-thick-left" aria-hidden="true"></span>Logout
        </NavLink>
    </li>

(This is Blazor)

user_36561520
Related