css - HTML: making iframe height fixed -
i have page included inside iframe on domain. issue iframe loaded vertical scrollbar. checked markup , here how include iframe:
<iframe class="plugin-frame js-plugin-frame" frameborder="0" marginheight="0" marginwidth="0" width="100%" height="auto" sandbox="allow-scripts allow-forms allow-same-origin allow-popups allow-top-navigation" src="https://mydomain/mypage.html"></iframe>
if change above to:
<iframe class="plugin-frame js-plugin-frame" frameborder="0" marginheight="0" marginwidth="0" width="100%" min-height="600px" sandbox="allow-scripts allow-forms allow-same-origin allow-popups allow-top-navigation" src="https://mydomain/mypage.html"></iframe>
it works.
is there can on page make work. need rid of vertical scrollbar , have no control on third party markup. there needed in markup of iframe fix this?
if don't want have scrollbar, want allow scrolling, can add following css (only works in webkit):
::-webkit-scrollbar {display: none}
if don't want have scrollbar , don't want scrolling can this:
body, html { overflow-y: hidden }
since assume want apply these styles if page iframed, use javascript job done:
if (top != self) { var style = document.createelement('style'); style.type = 'text/css'; style.innerhtml = '::-webkit-scrollbar {display: none}'; document.head.appendchild(style); }
Comments
Post a Comment