Image button as facebook globe icon notification

[Nareshkumar]

i want to create a facebook globe icon notification for my application. i planned to use image button. Please help me.... i need some sample code snippet

[Princy]

Hi Nareshkumar,

Please have a look into the following sample code snippet which shows facebook globe like notification along with RadImageButton.

ASPX:

<div id="Container">
    <telerik:RadButton ID="btnBgrImg2" runat="server" ForeColor="Black" CssClass="goButtonClassHov"
        Width="100" Height="95px">
        <Image ImageUrl="../Images/globe.jpg" IsBackgroundImage="true"></Image>
    </telerik:RadButton>
    <div class="bubble">
        2</div>
</div>

CSS:

<style type="text/css">
    #Container
    {
        position: relative; /* This is crucial for the absolutely positioned element */ /* This is just to show you where the container ends */
        width: 16px;
        height: 16px;
    }
    .bubble
    {
        position: absolute; /* This breaks the div from the normal HTML document. */
        top: 10px;
        right: -80px;
        padding: 1px 2px 1px 2px;
        background-color: red; /* you could use a background image if you'd like as well */
        color: white;
        font-weight: bold;
        font-size: 15px; /* The following is CSS3, but isn't crucial for this technique to work. */ /* Keep in mind that if a browser doesn't support CSS3, it's fine! They just won't have rounded borders and won't have a box shadow effect. */ /* You can always use a background image to produce the same effect if you want to, and you can use both together so browsers without CSS3 still have the rounded/shadow look. */
        border-radius: 30px;
    }
</style>

Please have a look into this link.
Thanks,
Princy.