Terrible

Bienvenue sur Terrible, le forum de libre-service pour vos codages de forums. Venez trouver ici toutes sortes de codes pour agrémenter aussi bien vos templates que vos messages, sans avoir besoin d'inscription !


Terrible :: Codes messages :: Divers
avatar
le Sam 17 Juin - 20:42
9:41 AM
Messages
Prénom
Details

Coucou
Je suis une bulle et je m'étire si besoin, autant que possible alors on va écrire un long texte pour voir ça.
J'aime le poulet et les patates
Message


Code:
<link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css"><style>.wrap-phone {width: 250px;height: 450px;border-radius:25px;margin: auto;position: relative;background-color: #444;border: 1px solid #2f2f2f;font-family: 'Roboto', sans-serif;}.cadre-phone {width: 220px;height: 340px;background-color: #fff;margin: 50px auto 15px;}.haut-phone {background-color: #f1f5f8;height: 50px;padding-top: 1px;box-sizing: border-box;border-bottom: 1px solid #fff;box-shadow: 0 1px 0 #e6e6e6;}.haut-phone div {width: 32%;display: inline-block;vertical-align: top;font-size: 10px;}.haut-phone div:nth-child(4),.haut-phone div:nth-child(5),.haut-phone div:nth-child(6) {margin-top: 10px;}.points, .messages {padding-left: 4px;box-sizing: border-box;}.points span {display: inline-block;height: 5px;width: 5px;border-radius: 50%;background-color: #000;margin-right: 1px;margin-top: 4px;}.heure, .nom{text-align: center;}.batterie, .details {text-align: right;width: 30%!important;}.messages, .details {color: #0055f4;}.mid-phone {height: 260px;position:relative;overflow:hidden;width:100%;}.mid-inner{overflow-x: hidden;overflow-y: scroll;height:100%;width:110%;}.scrollbar{text-align:justify;height:100%;width:100%;}bulle, bulle-rep {display: block;width: 70%;background: #e5e4ea;border-radius: 10px;padding: 8px;margin: 0 10px;font-size: 12px;position: relative;}bulle:after, bulle-rep:after {content: "";width: 0;height: 0;border-style: solid;border-width: 10px 10px 0 0;border-color: transparent #e5e4ea transparent transparent;position: absolute;bottom: 4px;left: -7px;}bulle-rep {background: #48bbfc;margin-left: 15%;color: #fff;}bulle-rep:after {border-width: 10px 0 0 10px;border-color: transparent transparent transparent #48bbfc;left: initial;right: -7px;}.bas-phone {background-color: #f1f5f8;height: 30px;margin-top: 1px;padding: 7px 5px;box-sizing: border-box;border-top: 1px solid #fff;box-shadow: 0 -1px 0 #e6e6e6;color: #abaaaa;}.reponse {width: 55%;background: #fff;color: #ccc;font-size: 13px;border: 1px solid #ccc;border-radius: 5px;padding: 0 6px;display: inline-block;margin: -2px 10px;vertical-align: top;position: relative;}.reponse:after {content: "Envoyer";right: -48px;position: absolute;font-size: 11px;top: 1px;}.credit {position: absolute;width: 100%;text-align: center;text-transform: uppercase;font-size: 8px;letter-spacing: 3px;margin-top: 20px;}.credit a {color: #ccc!important;text-decoration: none!important;}cercle {display: block;height: 30px;width: 30px;background: #2f2f2f;border-radius: 50%;margin: auto;}</style><div class="wrap-phone"><div class="credit"><a href="http://terrible.forumactif.org/" target="_blank">Awful phone</a></div><div class="cadre-phone"><div class="haut-phone"><div class="points"><span></span><span></span><span></span><span></span><span></span></div><div class="heure">9:41 AM</div><div class="batterie"><i class="fa fa-battery-full" aria-hidden="true"></i></div><div class="messages"><i class="fa fa-chevron-left" aria-hidden="true"></i> Messages</div><div class="nom">Prénom</div><div class="details">Details</div></div><div class="mid-phone"><div class="mid-inner"><div class="mid">
<bulle>Coucou</bulle>
<bulle-rep>Je suis une bulle et je m'étire si besoin, autant que possible alors on va écrire un long texte pour voir ça.</bulle-rep>
<bulle-rep>J'aime le poulet et les patates</bulle-rep><!--
--></div></div></div><div class="bas-phone"><i class="fa fa-camera" aria-hidden="true"></i><div class="reponse">Message</div></div></div><cercle></cercle></div>
Permission de ce forum:
Vous pouvez répondre aux sujets dans ce forum