Help with height dimensions


Hello Design Community!  I'm looking for a solution to a height dimension issue.  We were given instant webpage code to embed in our Hubspot pages, but it seems the two are waging war with each other.  The pages look terrible- the viewing "window" for the page content is a tiny sliver, as you can see here:

It has been suggested that the issue may have to do with the content behind an iframe. There's an inline style rule where the height is set to 187px, which isn't a lot of space to view the content. A possible fix would be to adjust the height dimensions, but that  would distort how the page is viewed on mobile. Another suggestion was to remove the page from behind the iframe... but this part of the page is within a custom module, and I don't know how to do that. Any suggestions? 

1 Reply 1
Contributor | Partner

Hi @stephcan 


This is something which isn't easily accomplished. Extending the height of an iframe based on the content inside is difficult.


The best you could possibly get is extending it to be the height of the viewable area but this would still mean 2 scrollbars.


There may be a JS library/script out there that can acheive this but i've not come across one (or needed it).


Even when you manage to get it to be the right height, you'll then neeed to think about it responsively (which is easier to do).