diff --git a/frontend/src/components/context-menu/context-menu.js b/frontend/src/components/context-menu/context-menu.js
index 4a14a18e74..956343979c 100644
--- a/frontend/src/components/context-menu/context-menu.js
+++ b/frontend/src/components/context-menu/context-menu.js
@@ -14,6 +14,8 @@ const propTypes = {
   getMenuContainerSize: PropTypes.func,
 };
 
+const MENU_BORDER_INDENT = 10;
+
 class ContextMenu extends React.Component {
 
   constructor(props) {
@@ -155,8 +157,12 @@ class ContextMenu extends React.Component {
       innerHeight = parseFloat(containerSize.height);
     }
 
-    if (y + rect.height > innerHeight) {
-      menuStyles.top -= rect.height;
+    if (y + rect.height > innerHeight - MENU_BORDER_INDENT) {
+      menuStyles.top = innerHeight - rect.height - MENU_BORDER_INDENT;
+    }
+
+    if (x + rect.width > innerWidth - MENU_BORDER_INDENT) {
+      menuStyles.left = innerWidth - rect.width - MENU_BORDER_INDENT;
     }
 
     if (menuStyles.left < 0) {
@@ -167,10 +173,6 @@ class ContextMenu extends React.Component {
       menuStyles.top = rect.height < innerHeight ? (innerHeight - rect.height) / 2 : 0;
     }
 
-    if (menuStyles.left + rect.width > innerWidth) {
-      menuStyles.left = innerWidth - rect.width;
-    }
-
     return menuStyles;
   };
 
diff --git a/frontend/src/components/dir-view-mode/dir-column-view.js b/frontend/src/components/dir-view-mode/dir-column-view.js
index 92401bb75a..4e6d7241da 100644
--- a/frontend/src/components/dir-view-mode/dir-column-view.js
+++ b/frontend/src/components/dir-view-mode/dir-column-view.js
@@ -129,7 +129,8 @@ class DirColumnView extends React.Component {
   };
 
   getMenuContainerSize = () => {
-    return window.getComputedStyle(this.viewModeContainer.current);
+    const { innerWidth, innerHeight } = window;
+    return { width: innerWidth, height: innerHeight };
   };
 
   render() {
diff --git a/frontend/src/metadata/metadata-view/components/table/table-main/records/index.js b/frontend/src/metadata/metadata-view/components/table/table-main/records/index.js
index e05f81add3..d85aefef21 100644
--- a/frontend/src/metadata/metadata-view/components/table/table-main/records/index.js
+++ b/frontend/src/metadata/metadata-view/components/table/table-main/records/index.js
@@ -612,14 +612,12 @@ class Records extends Component {
   renderRecordsBody = ({ containerWidth }) => {
     const { isGroupView, recordGetterByIndex } = this.props;
     const { recordMetrics, columnMetrics, colOverScanStartIdx, colOverScanEndIdx } = this.state;
-    const {
-      columns, allColumns, totalWidth, lastFrozenColumnKey, frozenColumnsWidth,
-    } = columnMetrics;
-    const contextMenu = (<ContextMenu isGroupView={isGroupView} recordGetterByIndex={recordGetterByIndex} />);
+    const { columns, allColumns, totalWidth, lastFrozenColumnKey, frozenColumnsWidth } = columnMetrics;
     const commonProps = {
       ...this.props,
       columns, allColumns, totalWidth, lastFrozenColumnKey, frozenColumnsWidth,
-      recordMetrics, colOverScanStartIdx, colOverScanEndIdx, contextMenu,
+      recordMetrics, colOverScanStartIdx, colOverScanEndIdx,
+      contextMenu: (<ContextMenu isGroupView={isGroupView} recordGetterByIndex={recordGetterByIndex} />),
       hasSelectedRecord: this.hasSelectedRecord(),
       getScrollLeft: this.getScrollLeft,
       getScrollTop: this.getScrollTop,