diff --git a/components/select/src/select/menu-wrapper.js b/components/select/src/select/menu-wrapper.js
index 30762c4c67..5b95d16de4 100644
--- a/components/select/src/select/menu-wrapper.js
+++ b/components/select/src/select/menu-wrapper.js
@@ -13,7 +13,7 @@ const MenuWrapper = ({
     selectRef,
 }) => {
     return (
-        <Layer onBackdropClick={onClick} transparent disablePortal>
+        <Layer onBackdropClick={onClick} transparent>
             <Popper
                 reference={selectRef}
                 placement="bottom-start"
diff --git a/components/select/src/single-select-field/features/can_show_conditionally.feature b/components/select/src/single-select-field/features/can_show_conditionally.feature
deleted file mode 100644
index d6386397ef..0000000000
--- a/components/select/src/single-select-field/features/can_show_conditionally.feature
+++ /dev/null
@@ -1,7 +0,0 @@
-Feature: Position of SelectField
-
-    Scenario: Keeps position when parent is hidden initially
-        Given a Select is hidden initially
-        When someone hovers over it to show it
-        And clicks the select
-        Then the select dropdown should be in the correct position
\ No newline at end of file
diff --git a/components/select/src/single-select-field/features/can_show_conditionally/index.js b/components/select/src/single-select-field/features/can_show_conditionally/index.js
deleted file mode 100644
index 7a8d116d0e..0000000000
--- a/components/select/src/single-select-field/features/can_show_conditionally/index.js
+++ /dev/null
@@ -1,24 +0,0 @@
-import { Given, Then, When } from '@badeball/cypress-cucumber-preprocessor'
-
-Given('a Select is hidden initially', () => {
-    cy.visitStory('SingleSelectField', 'With hidden parent')
-})
-
-When('someone hovers over it to show it', () => {
-    cy.get('.container .hiddenSelect').invoke('attr', 'style', 'display: block')
-})
-
-When('clicks the select', () => {
-    cy.get('[data-test="dhis2-uicore-select"]').click()
-})
-
-Then('the select dropdown should be in the correct position', () => {
-    cy.get('[data-test="hoverable-select-field"]').should('be.visible')
-    cy.get('[data-test="dhis2-uicore-singleselectoption"]').should(
-        ($selectField) => {
-            const { top, left } = $selectField.offset()
-            expect(top).to.be.greaterThan(0)
-            expect(left).to.be.greaterThan(0)
-        }
-    )
-})
diff --git a/components/select/src/single-select-field/single-select-field.e2e.stories.js b/components/select/src/single-select-field/single-select-field.e2e.stories.js
index 263f2e2205..c9f76263b4 100644
--- a/components/select/src/single-select-field/single-select-field.e2e.stories.js
+++ b/components/select/src/single-select-field/single-select-field.e2e.stories.js
@@ -43,42 +43,3 @@ export const WithFilterable = () => (
 )
 export const WithLoading = () => <SingleSelectField loading />
 export const WithoutOptions = () => <SingleSelectField />
-
-export const WithHiddenParent = () => {
-    return (
-        <>
-            <div className="container">
-                <div className="hoverSpan">
-                    <span>Hover over me</span>
-                    <div className="hiddenSelect">
-                        <SingleSelectField
-                            dataTest="hoverable-select-field"
-                            label="Choose something"
-                            onChange={() => {}}
-                        >
-                            <SingleSelectOption value="1" label="one" />
-                            <SingleSelectOption value="2" label="two" />
-                        </SingleSelectField>
-                    </div>
-                </div>
-            </div>
-            <style jsx>{`
-                .container {
-                    width: 100%;
-                    height: 100%;
-                    display: flex;
-                    flex-direction: column;
-                    align-items: center;
-                    justify-content: center;
-                    font-size: 1rem;
-                }
-                .hiddenSelect {
-                    display: none;
-                }
-                .hoverSpan:hover .hiddenSelect {
-                    display: block;
-                }
-            `}</style>
-        </>
-    )
-}