0

画像の右側をご覧ください。

表の 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>  
4

2 に答える 2

1

次の CSS を割り当てるだけでよいと思います。

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

display: inline-blockただし、一部の古いブラウザーではサポートされていません (例: MDN を参照)。

フィドルの例

于 2013-08-28T07:37:55.393 に答える