diff --git a/CHANGELOG.md b/CHANGELOG.md
index 0ac7968dbe2..fcf3b10d0e9 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,7 @@
 # [`master`](https://github.com/elastic/eui/tree/master)
 
+- Updated `<EuiOverlayMask>` to append `<div>` to body. [(#254)](https://github.com/elastic/eui/pull/254)
+
 **Bug fixes**
 
 - Disabled tab styling. [(#258)[https://github.com/elastic/eui/pull/258]]
diff --git a/src/components/overlay_mask/__snapshots__/overlay_mask.test.js.snap b/src/components/overlay_mask/__snapshots__/overlay_mask.test.js.snap
deleted file mode 100644
index 5cdf288d066..00000000000
--- a/src/components/overlay_mask/__snapshots__/overlay_mask.test.js.snap
+++ /dev/null
@@ -1,9 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`EuiOverlayMask is rendered 1`] = `
-<div
-  aria-label="aria-label"
-  class="testClass1 testClass2"
-  data-test-subj="test subject string"
-/>
-`;
diff --git a/src/components/overlay_mask/overlay_mask.js b/src/components/overlay_mask/overlay_mask.js
index 2866263373d..40947af3ccb 100644
--- a/src/components/overlay_mask/overlay_mask.js
+++ b/src/components/overlay_mask/overlay_mask.js
@@ -1,35 +1,54 @@
-import React, {
-  Component,
-} from 'react';
+/**
+ * NOTE: We can't test this component because Enzyme doesn't support rendering
+ * into portals.
+ */
+
+import { Component } from 'react';
 import PropTypes from 'prop-types';
+import { createPortal } from 'react-dom';
+import classNames from 'classnames';
 
 export class EuiOverlayMask extends Component {
   constructor(props) {
     super(props);
+
+    const {
+      className,
+      children, // eslint-disable-line no-unused-vars
+      ...rest
+    } = this.props;
+
+    this.overlayMaskNode = document.createElement('div');
+    this.overlayMaskNode.className = classNames(
+      'euiOverlayMask',
+      className
+    );
+    Object.keys(rest).forEach((key) => {
+      this.overlayMaskNode.setAttribute(key, rest[key]);
+    });
   }
 
   componentDidMount() {
     document.body.classList.add('euiBody-hasOverlayMask');
+    document.body.appendChild(this.overlayMaskNode);
   }
 
   componentWillUnmount() {
     document.body.classList.remove('euiBody-hasOverlayMask');
+
+    document.body.removeChild(this.overlayMaskNode);
+    this.overlayMaskNode = null;
   }
 
   render() {
-    const {
-      ...rest
-    } = this.props;
-
-    return (
-      <div
-        className="euiOverlayMask"
-        {...rest}
-      />
+    return createPortal(
+      this.props.children,
+      this.overlayMaskNode
     );
   }
 }
 
 EuiOverlayMask.propTypes = {
   className: PropTypes.string,
+  children: PropTypes.node,
 };
diff --git a/src/components/overlay_mask/overlay_mask.test.js b/src/components/overlay_mask/overlay_mask.test.js
deleted file mode 100644
index 4eb608a2725..00000000000
--- a/src/components/overlay_mask/overlay_mask.test.js
+++ /dev/null
@@ -1,16 +0,0 @@
-import React from 'react';
-import { render } from 'enzyme';
-import { requiredProps } from '../../test';
-
-import { EuiOverlayMask } from './overlay_mask';
-
-describe('EuiOverlayMask', () => {
-  test('is rendered', () => {
-    const component = render(
-      <EuiOverlayMask {...requiredProps} />
-    );
-
-    expect(component)
-      .toMatchSnapshot();
-  });
-});