如何为两列文本区域编写javascript代码

Question

我有一个网站，我需要使用此javascript代码显示加密货币的实时费率

<script type="text/javascript" src="https://files.coinmarketcap.com/static/widget/currency.js"></script>
<div class="coinmarketcap-currency-widget" data-currency="ripple" data-base="USD" data-secondary="" data-ticker="true" data-rank="true" data-marketcap="true" data-volume="true" data-stats="USD" data-statsticker="false"></div>

对于他们在我的网站上显示的其他加密货币，我还有其他三个这样的javascript代码

但是我需要它们显示在两列

中

请有人可以帮忙吗？

Answer 1

根本不需要使用Javascript。

您可以使用Bootstap's Grid System轻松实现此目的。

或者，如果您不使用Bootstrap，请尝试此CSS规则，由w3schools提供。

.column {
  float: left;
  width: 45%;
  padding: 2%;
}


/* Clear floats after the columns */

.row:after {
  content: "";
  display: table;
  clear: both;
}

<script type="text/javascript" src="https://files.coinmarketcap.com/static/widget/currency.js"></script>


<div class="row">
  <div class="column">
    <div class="coinmarketcap-currency-widget" data-currency="ripple" data-base="USD" data-secondary="" data-ticker="true" data-rank="true" data-marketcap="true" data-volume="true" data-stats="USD" data-statsticker="false"></div>
  </div>
  <div class="column">
    <div class="coinmarketcap-currency-widget" data-currency="bitcoin" data-base="USD" data-secondary="" data-ticker="true" data-rank="true" data-marketcap="true" data-volume="true" data-stats="USD" data-statsticker="false"></div>
  </div>
</div>