[ ← blog / codepen ](/) May 18, 2013  ·  \#codepen  ·  1 min read 

# CSS Facebook Chat Head



 I finally got my first codepen.io account, and created some CSS Facebook Chat heads. You can [check out the pen, and play around with it](http://codepen.io/mglaman/pen/ymbGv). Each chat head is draggable and click to open, click to close for the chat message. [![CSS Facebook Chat heads over at CodePen.io](http://glamanate.com/wp-content/uploads/2013/05/Screen-Shot-2013-05-18-at-12.08.21-PM.png)](http://codepen.io/mglaman/pen/ymbGv "View demo at codepen.io")I'm hoping to set up a real-world example using this technique soon. Such as viewing a module or plugin developers help page, and boom here comes their picture with a "tidbit" of information. 

  ![](/themes/custom/mglaman/images/headshot.webp)Thanks for reading

I write about Drupal, PHP, and the quiet infrastructure behind large sites — caching, config, and testing. New posts land every week or two.

 [Subscribe via RSS →](/rss.xml) [About me →](/about-me) 

 



 

  [← Older

Flush WordPress rewrite rules through phpMyAdmin

 ](/blog/flush-wordpress-rewrite-rules-through-phpmyadmin) [Newer →

Father's Day gifts for Web Developers.

 ](/blog/fathers-day-gifts-web-developers)