Как в css таблице сделать часть текста маленькой?

Question

[N0nV3r]

есть таблица, в ней нужно сделать часть текста маленькой

<table>
<tr>
  <th>Company</th>
  <th>Q1</th>
  <th>Q2</th>
  <th>Q3</th>
  <th>Q4</th>
  </tr>
 <tr>
  <td>123 Microsoft</td>
  <td>20.3</td>
  <td>30.5</td>
  <td>23.5</td>
  <td>40.3</td>
 </tr>
<tr>
  <td>123 Google</td>
  <td>50.2</td>
  <td>40.63</td>
  <td>45.23</td>
  <td>39.3</td>
</tr>
<tr>
  <td>123 Apple</td>
  <td>25.4</td>
  <td>30.2</td>
  <td>33.3</td>
  <td>36.7</td>
</tr>
<tr>
  <td>123 IBM</td>
  <td>20.4</td>
  <td>15.6</td>
  <td>22.3</td>
  <td>29.3</td>
</tr>
</table>

и

table {
font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
text-align: left;
border-collapse: separate;
border-spacing: 5px;
background: #ECE9E0;
color: #656665;
border: 16px solid #ECE9E0;
border-radius: 20px;
}
th {
font-size: 18px;
padding: 10px;
}
td {
background: #F5D7BF;
padding: 10px;
}

как сделать так чтоб все цифри перед компаниями бил маленькой и серой?

Answer 1

[Сергей delphinpro]

<td>
  <span>123<span>
  IBM
</td>

td > span {
  font-size: 0.75em;
  color: #ccc;
}