# Flash\[:notice\] e CSS

**URL:** <https://www.ruby-forum.com/t/flash-notice-e-css/153498>\
**Category:** IT\
**Created:** [November 18, 2008, 2:21am UTC](https://www.ruby-forum.com/t/flash-notice-e-css/153498 "2008-11-18T02:21:41Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![kerouak](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/k/6de8d8/32.png) [@kerouak](https://www.ruby-forum.com/u/kerouak)\
**Post date:** [November 18, 2008, 2:21am UTC](https://www.ruby-forum.com/t/flash-notice-e-css/153498/1 "2008-11-18T02:21:41Z")

</div>

Mi sapete dire come stilizzare via CSS il tag generato dal  
flash[:notice] ??

---

<div class="post-metadata">

**Author:** ![kerouak](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/k/6de8d8/32.png) [@kerouak](https://www.ruby-forum.com/u/kerouak)\
**Post date:** [November 18, 2008, 9:18am UTC](https://www.ruby-forum.com/t/flash-notice-e-css/153498/2 "2008-11-18T09:18:51Z")

</div>

nel css?

guardati il tag che genera se ne genera uno, non mi sembra, io di  
solito la wrappo in una div o quel che sia.

\<% if flash[:notice] %\>

\<div id='flash\_notice' ....

…  
…

---

<div class="post-metadata">

**Author:** ![kerouak](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/k/6de8d8/32.png) [@kerouak](https://www.ruby-forum.com/u/kerouak)\
**Post date:** [November 18, 2008, 9:20am UTC](https://www.ruby-forum.com/t/flash-notice-e-css/153498/3 "2008-11-18T09:20:41Z")

</div>

Puoi stilizzarlo come preferisci.  
Un esempio:

app/views/layouts/application.html.erb:

 \<%= content\_tag('div', flash[:error], :class =\> 'flash error') if flash[:error] %\> \<%= content\_tag('div', flash[:notice], :class =\> 'flash notice') if flash[:notice] %\> \<%= yield %\>

public/stylesheets/application.css:

div.flash {  
padding: 4px 4px 4px 30px;  
margin-bottom: 12px;  
font-size: 1.1em;  
border: 2px solid;  
margin-top: 8px;  
}

div.flash.error {  
background: url(…/images/false.png) 8px 5px no-repeat;  
background-color: #ffe3e3;  
border-color: #dd0000;  
color: #550000;  
}

div.flash.notice {  
background: url(…/images/true.png) 8px 5px no-repeat;  
background-color: #dfffdf;  
border-color: #9fcf9f;  
color: #005f00;  
}

---

<div class="post-metadata">

**Author:** ![kerouak](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/k/6de8d8/32.png) [@kerouak](https://www.ruby-forum.com/u/kerouak)\
**Post date:** [November 18, 2008, 9:52am UTC](https://www.ruby-forum.com/t/flash-notice-e-css/153498/4 "2008-11-18T09:52:55Z")

</div>

Davide S. wrote:

> Mi sapete dire come stilizzare via CSS il tag generato dal  
> flash[:notice] ??

Forse ti potrebbe interessare questo link  
[http://snippets.dzone.com/posts/show/6440](http://snippets.dzone.com/posts/show/6440)

---

<div class="post-metadata">

**Author:** ![kerouak](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/k/6de8d8/32.png) [@kerouak](https://www.ruby-forum.com/u/kerouak)\
**Post date:** [November 18, 2008, 11:09am UTC](https://www.ruby-forum.com/t/flash-notice-e-css/153498/5 "2008-11-18T11:09:25Z")

</div>

Pietro G. wrote:

> per quanto comodo sia questo approccio, lo sconsiglio, in quanto poco  
> accessibile: chi ha problemi di vista non distinguerebbe un warning da  
> un error o un notice, perchï¿½ le immagini css non hanno un tag “alt”.

Considera che ci sono anche un colore di fondo e di bordo che, come  
l’immagine, distinguono l’error dal notice.

---

<div class="post-metadata">

**Author:** ![kerouak](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/k/6de8d8/32.png) [@kerouak](https://www.ruby-forum.com/u/kerouak)\
**Post date:** [November 18, 2008, 10:54am UTC](https://www.ruby-forum.com/t/flash-notice-e-css/153498/6 "2008-11-18T10:54:30Z")

</div>

2008/11/18 Claudio Petasecca D. [removed\_email\_address@domain.invalid](mailto:removed_email_address@domain.invalid):

> div.flash.error {  
> background: url(…/images/false.png) 8px 5px no-repeat;

nota a margine:  
per quanto comodo sia questo approccio, lo sconsiglio, in quanto poco  
accessibile: chi ha problemi di vista non distinguerebbe un warning da  
un error o un notice, perché le immagini css non hanno un tag “alt”.

tutte le immagini che hanno una semantica, e non solo valenza  
estetica, dovrebbero essere inserite come tag img con un alt  
opportuno.

in alternativa si può usare lo stile, ripetendo però a parole quello  
che lo stile indica (esempio:

\<%= content\_tag(‘div’, "Errore! " + flash[:error], :class =\> ‘flash  
error’) if flash[:error] %\>
