Buenas noches amigos después de quedarme casi ciego entre CHROME y FIREFOX mirando que letra era mas pequeña o más grande, después de hacer el ejercicio he llegado a la conclusión que son prácticamente iguales, solo parece que chrome es como si se estirase hacia arriba un poquito, nada poquísimo pero hace el efecto ese, al menos para mí. Y sin mas os dejo el ejercicio para ver que os parece.
Saludos...
<!DOCTYPE html>
<html lang="es">
<head>
<meta name="description" content="portal web aprenderaprogramar.com">
<meta name="keywords" content="Mas uso de forzado de texto font-size, font-weight, font-style">
<meta charset="utf-8">
<title>Mas uso de forzado de texto font-size, font-weight, font-style</title>
<link rel="stylesheet" type="text/css" href="estilos18.css">
</head>
<body>
<!--Control-->
<div><h3 class="inlineBlock">5</h3><span style="font-size:1.125em; font-weight:bold;">5</span></div>
<!--fin del control-->
<table border="1px" class="inlineBlock" id="Firefox">
<caption>Firefox</caption>
<tr>
<th>Tipo de título</th>
<th>Pixeles</th>
<th>em</th>
</tr>
<tr>
<th><h1>h1</h1></th>
<td>32</td>
<td>2</td>
</tr>
<tr>
<th><h2>h2</h2></th>
<td>24</td>
<td>1.5</td>
</tr>
<tr>
<th><h3>h3</h3></th>
<td>18</td>
<td>1.125</td>
</tr>
<tr>
<th><h4>h4</h4></th>
<td>16</td>
<td>1</td>
</tr>
<tr>
<th><h5>h5</h5></th>
<td>13</td>
<td>0.8</td>
</tr>
<tr>
<th><h6>h6</h6></th>
<td>11</td>
<td>0.7</td>
</tr>
</table>
<table border="1px" class="inlineBlock" id="chrome">
<caption>Chrome</caption>
<tr>
<th>Tipo de título</th>
<th>Pixeles</th>
<th>em</th>
</tr>
<tr>
<th><h1>h1</h1></th>
<td>32</td>
<td>2</td>
</tr>
<tr>
<th><h2>h2</h2></th>
<td>24</td>
<td>1.5</td>
</tr>
<tr>
<th><h3>h3</h3></th>
<td>18</td>
<td>1.125</td>
</tr>
<tr>
<th><h4>h4</h4></th>
<td>16</td>
<td>1</td>
</tr>
<tr>
<th><h5>h5</h5></th>
<td>13</td>
<td>0.5</td>
</tr>
<tr>
<th><h6>h6</h6></th>
<td>11</td>
<td>0.7</td>
</tr>
</table>
</body>
</html>
Y ahora el CSS...
/*Ejercicio CU01044D del curso CSS comparar entre navegadores tamaños de textos*/
.inlineblock{display: inline-block;}
#firefox{text-align: center;}
#Firefox tr:first-child{background-color: grey;}
#firefox tr:nth-child(2) td{font-size: 32px;font-weight: bold;}
#firefox tr:nth-child(3) td{font-size: 24px;font-weight: bold;}
#firefox tr:nth-child(4) td{font-size: 18px;font-weight: bold;}
#firefox tr:nth-child(5) td{font-size: 16px;font-weight: bold;}
#firefox tr:nth-child(6) td{font-size: 13px;font-weight: bold;}
#firefox tr:nth-child(7) td{font-size: 11px;font-weight: bold;}
#chrome{text-align: center;}
#chrome tr:first-child{background-color: grey;}
#chrome tr:nth-child(2) td{font-size: 2em;font-weight: bold;}
#chrome tr:nth-child(3) td{font-size: 1.5em;font-weight: bold;}
#chrome tr:nth-child(4) td{font-size: 1.125em;font-weight: bold;}
#chrome tr:nth-child(5) td{font-size: 1em;font-weight: bold;}
#chrome tr:nth-child(6) td{font-size: 0.8em;font-weight: bold;}
#chrome tr:nth-child(7) td{font-size: 0.7em;font-weight: bold;}
Tema: CSS HTML diferencias chrome firefox font-size font-weight font-style CU01044D (Leído 2960 veces)
RSS -
WAP2