Rails・Deviceを使用したアプリ制作でflashが正しく表示されません.

前提・実現したいこと

Rubyでアプリを制作していますが, deviceを使用したログイン機構において, flashが正しく表示されません. どうにか正しく表示されるようにしたいです.

発生している問題・エラーメッセージ

deviseでログインした際のflashが正しく表示されません. 出てくるであろう場所に, 帯のような空白ができることから, うまいこと一番上に表示されていなかったりするのかな？(画像に埋もれているとか？)と思ったりしていますが, いまいちよくわかりません.

該当のソースコード

application.html.erb

<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <%= csrf_meta_tags %>
    <%= csp_meta_tag %>
    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
    <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
    <%= stylesheet_pack_tag 'application': "reload"%>
    <!--[if lt IE 9]>
  <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/r29/html5.min.js">
  </script>
<![endif]-->
    <title><%= full_title(yield(:title)) %></title>
  </head>

  <body class ="application">
    <p class="notice"><%= notice %></p>
    <p class="alert"><%= alert %></p>
    <%= render 'shared/header' %>
    <main role = "container">
      <%= yield %>
    </main>
  </body>
</html>

views/ shared/ _flash_messages.html.erb

<% flash.each do |msg_type, msg| %>
  <div class="alert alert-<%= msg_type %>" role="alert" id="alert">
    <a href="#" class="close" data-dismiss="alert">×</a>
    <%= msg %>
  </div>
<% end %>