如何内<td> <div> 联放置标签和标签？

Question

查看图像的右侧。

在表中，在Tonage Bytes下，我希望这个进度条与数据并排（内联），即与929.3一起。

如需参考，请参阅此图片。我想要完全相同的布局。

目前，他们都在不同的领域。那么我如何在线调整它们呢。

<tr>
    <td>Arts and Entertainment</td>
    <td>1</td>
    <td>1.03</td>
    <td>929.3
        <div class="progress">
            <div class="bar" style="width: 60%; height = 20px"></div>
        </div>
    </td>
</tr>  

Answer 1

我认为，您只需要分配以下CSS:

.progress {
  display: inline-block;
  width: 100px;
}

然而，display: inline-block不受一些较旧浏览器的支持（例如，请参阅MDN）

示例Fiddle

Answer 2

您可以尝试使用<span>而不是<div>。默认情况下，<span>是内联的。或者，您可以在style属性中设置css选项display: inline;或display: inline-block;