定位趋势视图小部件CSS

时间:2018-02-07 22:17:10

标签: javascript html css

我正在尝试定位我的小部件。它在本地主机上正确定位。但是,当我上传到文件服务器时,该位置被过度使用并且没有使用我的位置。

我只是希望能够移动小部件。任何样式都不起作用

https://www.tradingview.com/widget/

<div class="chart">
    <!-- TradingView Widget BEGIN -->
    <span  id="tradingview-copyright"><a ref="nofollow noopener" target="_blank" href="http://www.tradingview.com" style="color: rgb(173, 174, 176); font-family: &quot;Trebuchet MS&quot;, Tahoma, Arial, sans-serif; font-size: 13px;">Market Movers by <span style="color: #3BB3E4">TradingView</span></a></span>

    </div>

    <script type="text/javascript" src="https://s3.tradingview.com/external-embedding/embed-widget-hotlists.js">
        {
            "exchange": "US",
            "showChart": true,
            "locale": "en",
            "width": "400",
            "height": "600",
            "plotLineColorGrowing": "rgba(60, 188, 152, 1)",
            "plotLineColorFalling": "rgba(255, 74, 104, 1)",
            "gridLineColor": "rgba(242, 242, 242, 1)",
            "scaleFontColor": "rgba(218, 221, 224, 1)",
            "belowLineFillColorGrowing": "rgba(60, 188, 152, 0.05)",
            "belowLineFillColorFalling": "rgba(255, 74, 104, 0.05)",
            "symbolActiveColor": "rgba(242, 250, 254, 1)"
        }
    </script>

CSS

.chart {
  position: absolute;
  margin: 700px 450px 0 0;
  top: 0px;
  right: 0px;

}

1 个答案:

答案 0 :(得分:0)

为了能够移动容器,你必须移动正确的容器,但是你移动了错误的容器。只需使用调试控制台分析输出代码即可了解我的意思。请参阅此示例以将容器定位到其他位置:

.chart + div {
  position: absolute;
  left: 100px;
  top: 300px;
}
<div class="chart">
    <!-- TradingView Widget BEGIN -->
    <span  id="tradingview-copyright"><a ref="nofollow noopener" target="_blank" href="http://www.tradingview.com" style="color: rgb(173, 174, 176); font-family: &quot;Trebuchet MS&quot;, Tahoma, Arial, sans-serif; font-size: 13px;">Market Movers by <span style="color: #3BB3E4">TradingView</span></a></span>

</div>

<script src="https://s3.tradingview.com/external-embedding/embed-widget-hotlists.js">
    {
        "exchange": "US",
        "showChart": true,
        "locale": "en",
        "width": "400",
        "height": "600",
        "plotLineColorGrowing": "rgba(60, 188, 152, 1)",
        "plotLineColorFalling": "rgba(255, 74, 104, 1)",
        "gridLineColor": "rgba(242, 242, 242, 1)",
        "scaleFontColor": "rgba(218, 221, 224, 1)",
        "belowLineFillColorGrowing": "rgba(60, 188, 152, 0.05)",
        "belowLineFillColorFalling": "rgba(255, 74, 104, 0.05)",
        "symbolActiveColor": "rgba(242, 250, 254, 1)"
    }
</script>