I need assistance with aligning two ul blocks. Currently, they are displaying next to each other, but their alignment is starting from the bottom instead of the top:
<div class="ingredients-container">
<div style="display: inline-block; width: 15em">
<ul>
<li ng-repeat="...">
{{ ... }}
</li>
</ul>
</div>
<div style="display: inline-block; width: 15em">
<ul>
<li ng-repeat="...">
{{ ... }}
</li>
</ul>
</div>
</div>
The issue I'm facing is that the first li item in the right-hand side ul block is not aligned properly with the first li item on the left-hand side. It seems like the items are being aligned from the bottom of the container div instead. How can I reverse this alignment?