我试图在某些文本上使用 float right 但它拒绝工作

Question

这是一个 nodecg 包，所以请原谅所有看似无用的脚本标签

HTML

<body>
  <div class="main-list">
    <script>
      var type="donation";
      var user="TestUser";
      var amount=".00";
      document.write("<div class='list-element' class='" + type + "' >");
      document.write(user);
      document.write("<span class='pull-right'>" + amount + "</span>" + "</div>");
    </script>
  </div>
</body>

CSS

.main-list{
  margin: auto;
  width: 486px;
  color: #ecf0f1;
  font-size: 23px;
  background-color:#494949;
}
.list-element {
  list-style-type: none;
  padding-top: 9px;
  padding-left: 9px;
  height: 39px;
  border-top: 1px solid;
  rgba(125, 125, 125, .5);
  }
.pull-right: {
  float:right;
  margin-right:9px;
}

我知道这是草率的代码，我可以将其合并为一个 document.write，但我的问题是我无法获得右拉 class 以将金额向右移动。

https://jsfiddle.net/b9pzofLx/1/

Answer 1

看到这个fiddle

注意 .pull-right: { 在您的 CSS

您的 CSS 中有一个 : for pull-right，这在语法上是一个错误，因此没有应用该样式。正确的CSS如下

CSS

.pull-right {
  float:right;
  margin-right:9px;
}

我试图在某些文本上使用 float right 但它拒绝工作

I am trying to use float right on some text but it refuses to work

html

css

css-float

HTML

CSS

看到这个fiddle