html - 我如何在右侧粘贴 html 标签?

标签 html css

<分区>

我的目标很简单,将 p 标签粘贴到自定义 css 卡的右侧,使其粘贴到左侧非常简单。

custom-text {
  margin-left: 30px;
}

为了更好地说明这一点 enter image description here

问题是如何让 100 美元始终粘在右边? 假设美元的值(value)变为 5 美元,如何让它总是在右边?

我可以用

custom-text-right {
    margin-left: 450px;
}

但是这个解决方案不能扩展到不同的值(我使用 bootstrap 只是为了您的信息)

HTML 部分:

<h4>Price: <span class="dollar">$3.15</span></h4>

最佳答案

你可以使用 flexbox 来做到这一点,使用 justify-content: space-between;

.card {
  display: flex;
  height: 500px;
  width: 500px;
  background: #000;
  justify-content: space-between;
  color: white;
  padding: 30px;
  box-sizing: border-box
}
<div class="card">
  <span>Price:</span>
  <span> $100</span>
</div>

关于html - 我如何在右侧粘贴 html 标签?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43736092/

上一篇:javascript - 函数完成后jQuery隐藏div

下一篇:javascript - 当我在文本框中输入单词并点击空格键时,如何创建一个文本框,它必须将输入的单词变成一个单独的短语?

相关文章:

javascript - swisnl 的 jquery contextMenu 根据单击的元素将自定义数据添加到名称

javascript - 根据触摸事件旋转元素

HTML 电子邮件 - GMAIL 显示 block 无法正常工作

css - 根据其值动态更改每个单元格的背景颜色

css - Angular CLI 'ng serve' 忽略较少并使用可用的 css

php - Recaptcha V2.0 始终返回 bool(false)

css - 不能在另一个 div 中居中 div

javascript - 检查设备是否支持 ScreenOrientation.lock() - Uncaught Error screen.orientation.lock() 在此设备上不可用

jquery - 如何制作这种形状奇特的幻灯片?

javascript - 使用硬件加速时避免在 Chrome 中的图像上显示 "black squares"?