diff --git a/core/field_angle.ts b/core/field_angle.ts
index b04624691..e65ef16a9 100644
--- a/core/field_angle.ts
+++ b/core/field_angle.ts
@@ -219,8 +219,8 @@ export class FieldAngle extends FieldInput<number> {
       'version': '1.1',
       'height': FieldAngle.HALF * 2 + 'px',
       'width': FieldAngle.HALF * 2 + 'px',
-      'style': 'touch-action: none',
     });
+    svg.style.touchAction = 'none';
     const circle = dom.createSvgElement(
       Svg.CIRCLE,
       {
diff --git a/core/flyout_base.ts b/core/flyout_base.ts
index c9b822492..bb30a45cb 100644
--- a/core/flyout_base.ts
+++ b/core/flyout_base.ts
@@ -340,8 +340,8 @@ export abstract class Flyout extends DeleteArea implements IFlyout {
     // hide/show code will set up proper visibility and size later.
     this.svgGroup_ = dom.createSvgElement(tagName, {
       'class': 'blocklyFlyout',
-      'style': 'display: none',
     });
+    this.svgGroup_.style.display = 'none';
     this.svgBackground_ = dom.createSvgElement(
       Svg.PATH,
       {'class': 'blocklyFlyoutBackground'},
diff --git a/core/renderers/common/marker_svg.ts b/core/renderers/common/marker_svg.ts
index 728832f8c..5581dc317 100644
--- a/core/renderers/common/marker_svg.ts
+++ b/core/renderers/common/marker_svg.ts
@@ -641,7 +641,6 @@ export class MarkerSvg {
       {
         'width': this.constants_.CURSOR_WS_WIDTH,
         'height': this.constants_.WS_CURSOR_HEIGHT,
-        'style': 'display: none',
       },
       this.markerSvg_,
     );
@@ -653,7 +652,6 @@ export class MarkerSvg {
         'class': 'blocklyVerticalMarker',
         'rx': 10,
         'ry': 10,
-        'style': 'display: none',
       },
       this.markerSvg_,
     );
@@ -661,7 +659,7 @@ export class MarkerSvg {
     // A filled in puzzle piece used to represent an input value.
     this.markerInput_ = dom.createSvgElement(
       Svg.PATH,
-      {'transform': '', 'style': 'display: none'},
+      {'transform': ''},
       this.markerSvg_,
     );
 
@@ -671,13 +669,14 @@ export class MarkerSvg {
       Svg.PATH,
       {
         'transform': '',
-        'style': 'display: none',
         'fill': 'none',
         'stroke-width': this.constants_.CURSOR_STROKE_WIDTH,
       },
       this.markerSvg_,
     );
 
+    this.hide();
+
     // Markers and stack markers don't blink.
     if (this.isCursor()) {
       const blinkProperties = this.getBlinkProperties_();
diff --git a/core/renderers/zelos/marker_svg.ts b/core/renderers/zelos/marker_svg.ts
index bda30907d..4805e264b 100644
--- a/core/renderers/zelos/marker_svg.ts
+++ b/core/renderers/zelos/marker_svg.ts
@@ -116,11 +116,11 @@ export class MarkerSvg extends BaseMarkerSvg {
       Svg.CIRCLE,
       {
         'r': this.constants_.CURSOR_RADIUS,
-        'style': 'display: none',
         'stroke-width': this.constants_.CURSOR_STROKE_WIDTH,
       },
       this.markerSvg_,
     );
+    this.hide();
 
     // Markers and stack cursors don't blink.
     if (this.isCursor()) {
diff --git a/core/utils/dom.ts b/core/utils/dom.ts
index 0d05a6bf8..e9efca9f8 100644
--- a/core/utils/dom.ts
+++ b/core/utils/dom.ts
@@ -353,7 +353,10 @@ export function measureFontMetrics(
   block.style.height = '0';
 
   const div = document.createElement('div');
-  div.setAttribute('style', 'position: fixed; top: 0; left: 0; display: flex;');
+  div.style.display = 'flex';
+  div.style.position = 'fixed';
+  div.style.top = '0';
+  div.style.left = '0';
   div.appendChild(span);
   div.appendChild(block);
 
diff --git a/demos/blockfactory/workspacefactory/wfactory_generator.js b/demos/blockfactory/workspacefactory/wfactory_generator.js
index ca1a47b09..9f115c40b 100644
--- a/demos/blockfactory/workspacefactory/wfactory_generator.js
+++ b/demos/blockfactory/workspacefactory/wfactory_generator.js
@@ -45,7 +45,7 @@ WorkspaceFactoryGenerator.prototype.generateToolboxXml = function() {
   // Create DOM for XML.
   var xmlDom = Blockly.utils.xml.createElement('xml');
   xmlDom.id = 'toolbox';
-  xmlDom.setAttribute('style', 'display: none');
+  xmlDom.style.display = 'none';
 
   if (!this.model.hasElements()) {
     // Toolbox has no categories. Use XML directly from workspace.
@@ -111,7 +111,7 @@ WorkspaceFactoryGenerator.prototype.generateWorkspaceXml = function() {
   // Generate XML and set attributes.
   var xmlDom = Blockly.Xml.workspaceToDom(this.hiddenWorkspace);
   xmlDom.id = 'workspaceBlocks';
-  xmlDom.setAttribute('style', 'display: none');
+  xmlDom.style.display = 'none';
   return xmlDom;
 };
 
diff --git a/tests/playgrounds/screenshot.js b/tests/playgrounds/screenshot.js
index 6768694f1..af20f9d52 100644
--- a/tests/playgrounds/screenshot.js
+++ b/tests/playgrounds/screenshot.js
@@ -84,7 +84,7 @@ function workspaceToSvg_(workspace, callback, customCss) {
   );
   svg.setAttribute('width', width);
   svg.setAttribute('height', height);
-  svg.setAttribute('style', 'background-color: transparent');
+  svg.style.backgroundColor = 'transparent';
 
   const css = [].slice
     .call(document.head.querySelectorAll('style'))