Html “左对齐”；内容“；属性，但与div的实际内容对齐

我有一个固定宽度的盒子，我想左对齐美元符号，但右对齐金额

HTML

<div class="dollarAmount">80,500</div>
<div class="dollarAmount">1,150,000</div>

我创造了一个

---

谢谢

将您的before内容设置为向左浮动，而不是文本对齐

下面是它的外观：

.dollarAmount{width:80px;border:1px solid #ccc;text-align:right}
.dollarAmount:before {content: "$ ";float:left}

---

只要浮动美元符号：

.dollarAmount:before{content:“$”；float:left}

直接链接到编辑JSFIDLE:

.dollarAmount{width:80px;border:1px solid #ccc;text-align:right}
.dollarAmount:before {content: "$ ";float:left}