Créer une bulle d'information en HTML et CSS

Voici ma bulle d'information

Qu'est-ce qu'une bulle d'information ?

Quelques rappels :

la balise <BLOCKQUOTE> créé un retrait par rapport au texte normal.
la balise <CITE> sert à insérer une citation.

A coller en HTML (mode source)

<div id="bulle">
<blockquote>
<p>Voici ma bulle d'information</p>
</blockquote>
<cite>Qu'est-ce qu'une bulle d'information ?</cite></div>

Vous personnalisez les phrases qui sont en rouge

A coller tout à la fin du CSS Global

#bulle {width: auto; font-size: 10px; margin-bottom:20px;}

#bulle blockquote {margin: 0px; padding: 0px; border: 3px double #2f3343;background-color: #d8e2ec;}

#bulle blockquote p {margin: 10px; padding: 0px;}

#bulle cite {position: relative;margin: 0px;padding: 7px 0px 0px 15px;top: 0px;
    background: transparent url(http://nsm01.casimages.com/img/2008/03/22//08032210143562651856067.gif) no-repeat 20px 0; font-style: normal;}

Vous pouvez ensuite modifier

1. la taille de police (en bleu)
2. la bordure (en vert)
3. la couleur de fond (en orange)
4. la petite queue de la bulle (celle-ci est hébergée, vous pouvez donc vous en servir

Comments

[:0010: soleil51 :0038:]

Je vais essayer mais ce n'est pas gagné ! ! lol !
Belle journée
1001 bisous de la mer rouge
@nne-mar♪e