I've been attempting to align certain elements to the right in the navbar using Bootstrap by utilizing mr-auto, but it doesn't seem to be functioning properly. What steps should I take to ensure it works correctly? Below is a snippet of my index.html code.
<html lang="en" dir="ltr">
<head>
...
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
...
<ul class="navbar-nav mb-2 mb-lg-0 ml-auto"> */here i used ml-auto for margin*/
...
</ul>
</nav>
</body>
</html>
According to Bootstrap's documentation, using ml-auto results in left margins and mr-auto in right margins. However, this setup isn't producing the desired outcome in my case. How can I troubleshoot this issue effectively?