JSFiddle - React, Tailwind, and code Playground
by no2don
HTML
<div class="box">
<!-- TradingView Widget BEGIN -->
<div class="tradingview-widget-container">
<div class="tradingview-widget-container__widget" style='padd'></div>
<div class="tradingview-widget-copyright"></div>
<script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-symbol-info.js" async>
{
"symbol": "BINANCE:BNBPERP",
"width": "100%",
"locale": "zh_TW",
"colorTheme": "dark",
"isTransparent": false
}
</script>
</div>
<!-- TradingView Widget END -->
</div>
<div class="box">
<!-- TradingView Widget BEGIN -->
<div class="tradingview-widget-container">
<div class="tradingview-widget-container__widget"></div>
<div class="tradingview-widget-copyright"></div>
<script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-symbol-info.js" async>
{
"symbol": "BINANCE:BTCPERP",
"width": "100%",
"locale": "zh_TW",
"colorTheme": "dark",
"isTransparent": false
}
</script>
</div>
<!-- TradingView Widget END -->
</div>
<div class="box">
<!-- TradingView Widget BEGIN -->
<div class="tradingview-widget-container">
<div class="tradingview-widget-container__widget"></div>
<div class="tradingview-widget-copyright"></div>
<script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-symbol-info.js" async>
{
"symbol": "BINANCE:DOGEPERP",
"width": "100%",
"locale": "zh_TW",
"colorTheme": "dark",
"isTransparent": false
}
</script>
</div>
</div>
<div class="box">
<div class="tradingview-widget-container">
<div class="tradingview-widget-container__widget"></div>
<div class="tradingview-widget-copyright"></div>
<script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-symbol-info.js" async>
{
...
CSS
.box {
float:left;
width: 50%;
}
iframe {
width:100%;
}