Buenas,
La pregunta es sencilla: cuando usas font-size se refiere al alto siempre, ya que el ancho dependerá del tipo de letra que utilices, algunas son más anchas que otras.
De todas formas, es fácil de comprobar si no te fías:
HTML:
Código:
<html>
<head>
<title>Test</title>
<link rel="StyleSheet" type="text/css" href="style\test.css" />
</head>
<body>
<span id="texto">Á</span><div id="derecha"></div>
<div id="abajo"></div>
</body>
</html>
CSS:
Código HTML:
#texto {
float: left;
font-size: 20px;
font-family: Arial;
}
#derecha {
float: left;
height: 20px;
width: 200px;
background-color: blue;
}
#abajo {
clear: both;
height: 200px;
width: 20px;
background-color: red;
}
Esto crea una letra Á (el acento lo añado porque las letras normales dejan también sitio por arriba para los símbolos de acentuación) de 20px, un div a la derecha de 20px de alto y un div abajo de 20px de ancho. Verás que la letra coincide con el div de la derecha, luego font-size afecta al alto siempre.
Pero ten cuidado con estos cálculos, porque si es verdad que las fuentes suelen dejar espacio vacío por arriba, por abajo no lo hacen. Si sustituyes la 'Á' por una 'y', por ejemplo, verás que la parte de abajo de la letra se sale de los 20px de tamaño.
Espero que te sirva y, como consejo, siempre intenta hacer pruebas sencillitas, muchas veces es muy útil sacar el trozo de código que quieras a un HTML nuevo y probar, así evitas que los demás elementos afecten.
Un saludo.