css - Flicker while scrolling down in Safari -
i want embed monaco editor in page under fixed texts, want height of monaco editor fill rest of page. people gave me answer (jsbin):
<html> <style> body { margin: 0; height: 100%; } .rb { height: 100%; display: flex; flex-direction: column; } .myme { flex:1; background: grey; } #container > * { max-height:100%; overflow:auto; } </style> <body> <div class="rb"> <div class="top">1<br/>2<br/>3<br/>4<br/></div> <div class="myme" id="container"></div> </div> <script src="https://www.matrixlead.com/monaco-editor/min/vs/loader.js"></script> <script> require.config({ paths: { 'vs': 'https://www.matrixlead.com/monaco-editor/min/vs' }}) require(["vs/editor/editor.main"], function () { var editor = monaco.editor.create(document.getelementbyid('container'), { value: 'function x() {\n\tconsole.log("hello world!");\n}', language: 'javascript', minimap: { enabled: false }, automaticlayout: true, scrollbeyondlastline: false }); }); </script> </body> </html>
it works in chrome. however, in safari, while scrolling down quickly, see flicker.
does know how fix this?
remove overflow: auto
in rule fix safari scrolling glitch:
#container > * { max-height: 100%; overflow: auto; /* remove */ }
Comments
Post a Comment