Letter spacing issue with 'overlapping' character
- by Wesz-T
I'm having some trouble with a font I found on Google Web Fonts.
As you can see in the image posted below, the capital V in 'Versus' overlaps with the 'e' when i'm using Firefox. Though when i'm using Chrome (or IE) it does not overlap and leaves me with an ugly space between the two characters.
Is there any way to fix this and make it look like the one in Firefox? Or should I start looking for another font?
My HTML:
<html>
<head>
<meta charset="utf-8">
<title>Versus</title>
<link rel="stylesheet" type="text/css" href="css/reset.css" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
<link href='http://fonts.googleapis.com/css?family=Marck+Script' rel='stylesheet' type='text/css'>
</head>
<body>
<div>
<h1>Versus</h1>
</div>
</body>
My CSS:
h1 {
font-family: 'Marck Script', cursive;
font-size: 100px;
color:#444;
text-align:center;
padding:0 50px;
text-shadow: 2px 2px 3px #777;
}
Thanks in advance!