Mensajes en cajas redondeadas

Este es un truco en CSS bastante bueno pues ya que se pueden hacer este tipo de efectos con imagenes y es bastante dificil subir imagenes, encontrar el color adecuado, para cambiar el color, etc..

Pero gracias a este código lo podemoas hacer sion imagenes, si tienen blogger podrás ya antes haber visto esto y si no es algo como esto

Tus cambios se han guardado correctamente

para obetner este efecto solo tienes que añadir al final de la plantilla CSS de blogger que esta antes de ]]></b:skin> el siguiente código:

.cajaredonda {
display:inline;
border:1px solid #ff0000;
background-color:#ffffff;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
color:#cecece;
text-align: left;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
padding: 4px;
}


una vez hecho esto, solo pones esto otro en donde quieras ver la caja de mensaje redonda:
<span class="cajaredonda">Tus cambios se han guardado correctamente</span>

Nota: Si quieres ver un mensaje de una linea, es decir un renglón o como lo llames, añades el código de arriba pero si el mensaje es mayor a una linea solo añades:

style="display:block;width:220px;" en :
<span class="cajaredonda">Tus cambios se han guardado correctamente</span>
Y quedará asi:
<span class="cajaredonda" style="display:block;width:220px;" >Tus cambios se han guardado correctamente</span>

si no haces esto y el texto es mayor a una linea se verá asi:
.cajaredonda {
display:inline;
border:1px solid #ff0000;
background-color:#ffffff;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
color:#cecece;
text-align: left;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
padding: 4px;
}