Letter spacing issue with 'overlapping' character
Posted
by
Wesz-T
on Stack Overflow
See other posts from Stack Overflow
or by Wesz-T
Published on 2012-09-20T20:19:19Z
Indexed on
2012/09/20
21:38 UTC
Read the original article
Hit count: 259
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!
© Stack Overflow or respective owner