Add a Bubble around PostBit Info

[OliverE]

[PostBit Bubble]

In this tutorial Im just going to show you how to add a bubble around your postbit info.

---

CSS

Add the CSS Code to you global.css style (anywhere will do)

.post_border {
    background: none repeat scroll 0 0 #F4FDEC;
    border: 1px solid #D0D0D0;
    border-radius: 3px 3px 3px 3px !important;
    color: #5E5E5E;
    display: block;
    font-style: italic;
    margin: 2px;
    padding: 3px;
    text-shadow: 0 1px 0 #FFFFFF;
    width: 200px;
}

[/hidepost]

---

Template Edits - Post Bit > Postbit

Before

{$post['user_details']}

Add

<div class="post_border">

After

<div class="post_border">{$post['user_details']}

Add

</div>

---

Enjoy.​

 

[Factor8™]

I don't really like this. Kind of makes everything unorgranised.

 

[OliverE]

Im trying to get ours all in one bubble, but for now its in two.

 

[м¢ℓσνιη]

Where did you get those icons?

 

[OliverE]

http://www.iconfinder.com

 

[Ewan]

Nice, will try it out tomorrow

Are the icons on iconfinder free for you to use?

---

It's made 2 duplicate postbits for the rep/posts join date etc...

 

[OliverE]

Can you show me a screenshot please.

 

[Ewan]

I've taken it off right now, I'll do it later and upload it.