diff --git a/README.md b/README.md
index 4145beb7693679af77be1921165d96e6b17dc219..18a73037572a529434571268c6e0626d818071ab 100644
--- a/README.md
+++ b/README.md
@@ -65,6 +65,7 @@
 * Issue #9 URL: /who/update/short 
 * Issue #10 async who_update_short_task
 * Issue #11 WhoServiceUpdate.__update_who_global_data_short()
+* Issue #12 better layout for flash messages
 
 ### 0.0.8 Release
 * Issue #3 ORM: 3NF for ecdc_europa_data_import
diff --git a/templates/fragment_flashed_messages.html b/templates/fragment_flashed_messages.html
new file mode 100644
index 0000000000000000000000000000000000000000..7a44176f55935cb29e03315ed2721350f6130f18
--- /dev/null
+++ b/templates/fragment_flashed_messages.html
@@ -0,0 +1,5 @@
+<div class="fragment-flash-messages">
+{% for message in get_flashed_messages() %}
+    <div class="alert alert-success" role="alert">{{ message }}</div>
+{% endfor %}
+</div>
\ No newline at end of file
diff --git a/templates/layout.html b/templates/layout.html
index abde632082b5aaa08a58f6104108c9598d9719c6..12a19b081a643dfdaec4ab9964257d38f9eeac86 100644
--- a/templates/layout.html
+++ b/templates/layout.html
@@ -58,9 +58,7 @@
 
     <main>
         <div class="container">
-            {% for message in get_flashed_messages() %}
-                <p style="color: red;">{{ message }}</p>
-            {% endfor %}
+            {% include 'fragment_flashed_messages.html' %}
             {% block main_container %}{% endblock %}
         </div>
     </main>