HTML Element Height Issue

  • sliggy

    (@sliggy)


    7 years ago

    I am working to get a widget from: https://www.tradingview.com/widget/advanced-chart/ to auto size on this page: baronsleague.com/ethereum/

    right now the height of the widget is too small. There is no easy hight adjustment (that I could find for the HTML element).

    the trading view widget even says that I must set a specific height for the parent element to get a regularly shaped widget.

    Ive tried to add the css: 

    selector{height: 610px;}

    I’ve tried the above code for the HTML element, the box around the HTML and the box the previous box was in, but I could not get the widget to be the proper height.

    I’m sure I’m missing something, please give me any suggestions.

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)
  • pingram

    (@pingram3541)

    This is not an Elementor support question fyi, it’s more of less asking how to do what a web developer would do, write code. That said, I’m happy to help regardless and I think it could be fairly simple =)

    The issue is the widget is loaded in an iframe and it is already set with height 100% which matches it’s parent container’s height but the parent container is a simple div which is also defined with a height of 100%, again only being able to grow as tall as the parent allows but meaning it will automatically grow in height based on it’s inner content. Catch 22 going on here.

    You can try something like using vh units, i.e.

    #tradingview_e4755-wrapper iframe {
  min-height: 60vh;
}

    This would say, take up 60% of the vertical space of the browser window no matter how it is sized.

    Alternatively you could set in px, min-height: 300px for example to always be at least 300px in height regardless of the browser window height.

    • This reply was modified 7 years ago by pingram. Reason: formatting cleanup
Viewing 1 replies (of 1 total)
  • The topic ‘HTML Element Height Issue’ is closed to new replies.