Hi I have an iframe and I am trying to hide the scroll bar however with the code I'm assuming it doesn't seem to disappear. Any suggestions?

enter image description here

<div style="overflow: hidden; margin: 15px auto; max-width: 800px;">
<iframe scrolling="no" src="https://bp365.sharepoint.com/sites/COP/DataScience/SitePages/News.aspx" style="border: 0px none; width: 750px; height: 500px; ">
  • edit max-width: 900px; – Fox Nov 1 '18 at 13:59
  • It still appears. Any other suggestions? – Danielle Sutton Nov 1 '18 at 14:20
  • Check or increase the script editor width by editing the webpart.. – THIVAGAR SEGAR Nov 1 '18 at 14:34
  • still didnt work... – Danielle Sutton Nov 1 '18 at 15:34

We can add react script editor web part into News.aspx page, and add the style below into the web part.

  overflow-y: hidden !important;
  overflow-x: hidden !important;

The React Script Editor solution from here:


| improve this answer | |
  • Thanks. Unfortunately due to limitations on modern pages the modern script web-part is restricted and not accessible to complete from the solution you have provided – Danielle Sutton Nov 2 '18 at 14:06
  • Did you install the react script editor web part? – LZ_MSFT Nov 5 '18 at 1:20
  • Unfortunately this isn't available to download due to admin restrictions from the client – Danielle Sutton Nov 5 '18 at 10:46
  • Follow the article sadomovalex.blogspot.com/2017/12/… to install it. – LZ_MSFT Nov 6 '18 at 1:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.