HTML CSS examples for CSS Widget:Tooltip
Speech bubble tooltip in CSS
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> .bubble {<!-- www . j a v a2 s .co m--> position: relative; background-color:#eee; margin: 0; top:50px; padding:10px; text-align:center; width:180px; -moz-border-radius:10px; -webkit-border-radius:10px; -webkit-box-shadow: 0px 0 3px rgba(0,0,0,0.25); -moz-box-shadow: 0px 0 3px rgba(0,0,0,0.25); box-shadow: 0px 0 3px rgba(0,0,0,0.25); } .bubble:before { border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #EEEEEE; border-style: solid; border-width: 26px; content: ""; top:-53px; display: block; height: 0; left: 4em; position: absolute; width: 0; } </style> </head> <body> <div class="bubble"> Show more </div> </body> </html>