html - 我试图在某些文本上使用float，但它拒绝工作 - Thinbug

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

时间：2016-01-30 17:30:17

标签： html css css-float

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

HTML

<body>
  <div class="main-list">
    <script>
      var type="donation";
      var user="TestUser";
      var amount="$1.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中，但我的问题是我无法通过右拉类将数量移到右边。

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

1 个答案:

答案 0 :(得分：1)

请参阅此`Application` documentation

请注意CSS中的.pull-right: {

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

CSS

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