Я пытаюсь выровнять пункт меню вправо, однако он не работает. Вместо этого пункт меню (кнопка выхода из системы) располагается под остальными элементами.
Разметка, которую я использую для заголовка (та, в которой кнопка выхода расположена ниже, а не справа):
<html>
<head>
<title>Sistema de Solicitação de Empréstimo</title>
<meta http-equiv="X-UA-Compatible" content="IE-edge">
<meta name="viewport" content="width=devide-width, initial-scale=1">
<meta name="csrf-token" content="{{ csrf_token() }}">
<link href="/css/bootstrap.min.css" rel="stylesheet">
<link href="/_css/estilo.css" rel="stylesheet">
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.5.0/css/bootstrap-datepicker.css" rel="stylesheet">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.5.0/js/bootstrap-datepicker.js"></script>
<style>
.maincontent {
padding-top: 80px;
}
.center-block {
text-align: center;
margin-top: 5px;
margin-bottom: 5px;
}
</style>
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="navbar-collapse collapse">
<!--<ul style="color: white" class="nav navbar-nav">
<li><a href="principal">Principal</a></li>
<li><a href="sobre">Sobre</a></li>
<li><a href="http:\\link">Login</a></li>
<li><a href="http:\\link">Registrar-se</a></li>
</ul>-->
<ul style="color: white" class="nav navbar-nav">
@if (Route::has('login'))
@auth
<li style="margin-right: 20px"><a href="{{ url('/home') }}">Perfil</a></li>
@if (!Auth::user()->isAdmin)
<li><a href="{{ url('/produtos') }}">Produtos</a></li>
<li style="margin-left: 20px"><a href="{{ url('/nova_solicitacao') }}">Nova Solicitação</a></li>
<li><a href="{{ url('/solicitacoes') }}">Solicitações</a></li>
@endif
@if (Auth::user()->isAdmin)
<li><a href="{{ url('/solicitacoes_aprovar_reprovar') }}">Analisar Solicitações</a></li>
<li><a href="{{ url('/novo_produto') }}">Novo Produto</a></li>
@if (Route::has('register'))
<li><a href="{{ route('register') }}">Registrar</a></li>
</ul>
@endif
@endif
<div class=".btn-nav topnav-right">
<ul style="color: white" class="nav navbar-nav topnav-right">
<li style="margin-left: 20px"><a href="{{ route('logout') }}"
onclick="event.preventDefault();
document.getElementById('logout-form').submit();">
{{ __('Logout') }}
</a>
<form id="logout-form" action="{{ route('logout') }}" method="POST" style="display: none;">
@csrf
</form></li>
</ul>
</div>
@else
<ul>
<li><a href="principal">Principal</a></li>
<li><a href="sobre">Sobre</a></li>
<li style="margin-left: 20px"><a href="{{ route('login') }}">Login</a></li>
<li><a href="login_admin">Administrador</a></li>
@endauth
@endif
</ul>
</div>
</div>
</div>
<main role="main" class="maincontent">
@hasSection('body')
@yield('body')
@endif
</body>
</html>
Я пытаюсь использовать класс topnav- право выровнять элемент вправо, однако это не работает. Я пробовал другое решение, которое нашел в сети, но они тоже не работают.
Как я могу сделать это правильно?