Overlapping text-shadow

[gnolan]

Hi,

I'm having a problem with the text-shadow property. Firstly, here is the code:

<div id="logo">
	<h1>Rooms</h1>
	<h2>Forums</h2>
</div>		<!--end of logo div-->

div#logo h1{
	font-size: 2.4em;
	font-weight: 900;
	font-family: Arial Black;
	color: #c87276;
	padding: 49px 0px 0px 0px;
	margin: 0;
	letter-spacing: -0.0em;
	line-height:90%;
	text-shadow: -6px 6px 2px #000000;
}

So this is how the problem manifests itself.

The shadow from the "s" in "Rooms" overlaps the letter "m". The shadow from "m" overlaps the letter "o" and so on. There must be some way to keep the shadows behind the text.

[sunfighter]

What browser are you using? It looks ok to me in FF, chrome, safari, and opera.

[gnolan]

I'm using Chrome. See the title "Engine Room" with the overlapping shadows.

[sunfighter]

I'm sorry, I'm old and I guess my eyes are not so good. I see what your talking about now. Your coding is correct, so I went to the chrome forums and found that this is now a problem with chrome. Hopefully they will correct it next release. Right now -3px instead of -6px works OK.