title: CSS styling of flash message
body: <p>What should I use to style my flash messages in my CSS? I can't seem to change it's styling. Here's the relevant code within the <code>&lt;body&gt;</code> of my application layout:</p>
  
  <pre><code>    &lt;div class="container"&gt;
        &lt;%= render 'layouts/header' %&gt;
        &lt;section class="round"&gt;
          &lt;div id= "notice"&gt;
            &lt;% flash.each do |key, value| %&gt;
              &lt;div class="flash &lt;%= key %&gt;"&gt;
                &lt;%= value %&gt;
              &lt;/div&gt;
            &lt;% end %&gt;
          &lt;/div&gt;
          &lt;%= yield %&gt;
        &lt;/section&gt;
        &lt;%= render 'layouts/footer' %&gt;
        &lt;%= debug(params) if Rails.env.development? %&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>The relevant original CSS was something like this but it doesn't currently work.</p>
  
  <pre><code>.error, .alert, .notice, .success, .info {padding:0.8em;margin-bottom:1em;border:2px solid #ddd;}
  .success {background:#e6efc2;color:#264409;border-color:#c6d880;}
  </code></pre>