Drop shadow for username

[troykp]

Hi,

I'm looking to add a drop shadow to usernames, as shown here:

https://vborg.vbsupport.ru/external/2011/02/10.png

I'm guessing it's something I need to include in my additional CSS template (unless it's a stylevar I'm unaware of). Does anybody know what code it is?

Thanks

[creppello]

Both actually, you need to add to your code, and to your stylesheet.

Add this to the section of css you want the shadow to appear with.....
<div class="shadow">
<div class="content">
<p>This is the div element that will have the shadow on it. You can also shadow images instead of a div with content in it.</p>
</div>
</div>


Then add this to your stylesheet....
.content, .shadow {
position: relative;
bottom: 5px;
right: 5px;
}
.shadow { background-color: #ccc; }

I think that's right. The settings for bottom and right are the number of offset pixels for the shadow.

[troykp]

Thank you for the response creppello.

I added the first section of code to my postbit legacy, and the second part to my additional.css. I couldn't get it working though.

I also tried adding the first section to my postbit CSS, that didn't work either.

Am I adding it to the right templates?

[Lynne]

Please post a link to a page where we can see what you tried.

[troykp]

<a href="http://forums.wrestlingsmarks.com/showthread.php/1711-WrestlingSmarks-February-2011-Award-Winners?p=6478#post6478" target="_blank">Link</a>

I've used white so the forum doesn't look too ugly whilst the incorrect code. As you'll see, I'm definitely doing something wrong.

[Lynne]

Just now really looking at the CSS posted and I don't see how that would create a shadow effect. Unfortunately, shadowing is not something all browsers can do using the same CSS, so you need to add quite a bit of CSS to get that affect in all browsers. Lots of stuff comes up in google including this that seems pretty complete - http://www.workingwith.me.uk/articles/css/cross-browser-drop-shadows