html - 类别向左浮动的堆栈图

Question

我正在使用 CSS div 作为图表，我正在尝试制作一个堆叠图表，其中 div 等于 div 宽度的 100%，条形的左侧部分是一种颜色，另一部分是酒吧是另一个。现在我有:

.chart div {
  font: 25px sans-serif;
  background-color: #2c3e50;
  text-align: right;
  padding: 3px;
  margin: 1px;
  color: white;
}

<div class="chart">
  <div style="width: 49.81%;">1, $4,980,777</div>
  <div style="width: 41.10%;">2, $4,109,778</div>
</div>

这是 https://jsfiddle.net/j63grq88/

Answer 1

尝试将 display: inline-block; 添加到两个 div