diff --git a/src/components/AnchorForCommentsOnly/BaseAnchorForCommentsOnly.js b/src/components/AnchorForCommentsOnly/BaseAnchorForCommentsOnly.js
index 18d3fbf25960..22a4ce75f99c 100644
--- a/src/components/AnchorForCommentsOnly/BaseAnchorForCommentsOnly.js
+++ b/src/components/AnchorForCommentsOnly/BaseAnchorForCommentsOnly.js
@@ -65,7 +65,7 @@ const BaseAnchorForCommentsOnly = (props) => {
             onPressIn={props.onPressIn}
             onPressOut={props.onPressOut}
         >
-            <Tooltip containerStyles={[styles.dInline]} text={Str.isValidEmail(props.displayName) ? '' : props.href}>
+            <Tooltip text={Str.isValidEmail(props.displayName) ? '' : props.href}>
                 <Text
                     ref={el => linkRef = el}
                     style={StyleSheet.flatten([props.style, defaultTextStyle])}
diff --git a/src/components/AvatarWithIndicator.js b/src/components/AvatarWithIndicator.js
index 6430d463a712..9bae6d9488c6 100644
--- a/src/components/AvatarWithIndicator.js
+++ b/src/components/AvatarWithIndicator.js
@@ -85,8 +85,8 @@ const AvatarWithIndicator = (props) => {
     const shouldShowIndicator = _.some(errorCheckingMethods, errorCheckingMethod => errorCheckingMethod());
 
     return (
-        <View style={[isLarge ? styles.avatarLarge : styles.sidebarAvatar]}>
-            <Tooltip text={props.tooltipText}>
+        <Tooltip text={props.tooltipText}>
+            <View style={[isLarge ? styles.avatarLarge : styles.sidebarAvatar]}>
                 <Avatar
                     imageStyles={[isLarge ? styles.avatarLarge : null]}
                     source={props.source}
@@ -95,8 +95,8 @@ const AvatarWithIndicator = (props) => {
                 {shouldShowIndicator && (
                     <View style={StyleSheet.flatten(indicatorStyles)} />
                 )}
-            </Tooltip>
-        </View>
+            </View>
+        </Tooltip>
     );
 };
 
diff --git a/src/components/DisplayNames/index.js b/src/components/DisplayNames/index.js
index fd23a011bf69..83def9ce8c05 100644
--- a/src/components/DisplayNames/index.js
+++ b/src/components/DisplayNames/index.js
@@ -95,7 +95,6 @@ class DisplayNames extends PureComponent {
                             <Tooltip
                                 key={index}
                                 text={tooltip}
-                                containerStyles={[styles.dInline]}
                                 shiftHorizontal={() => this.getTooltipShiftX(index)}
                             >
                                 {/*  // We need to get the refs to all the names which will be used to correct
diff --git a/src/components/EmojiPicker/CategoryShortcutButton.js b/src/components/EmojiPicker/CategoryShortcutButton.js
index 2c5f061327ae..33d5576c29ea 100644
--- a/src/components/EmojiPicker/CategoryShortcutButton.js
+++ b/src/components/EmojiPicker/CategoryShortcutButton.js
@@ -33,20 +33,19 @@ class CategoryShortcutButton extends PureComponent {
 
     render() {
         return (
-            <Pressable
-                onPress={this.props.onPress}
-                onHoverIn={() => this.setState({isHighlighted: true})}
-                onHoverOut={() => this.setState({isHighlighted: false})}
-                style={({pressed}) => ([
-                    StyleUtils.getButtonBackgroundColorStyle(getButtonState(false, pressed)),
-                    styles.categoryShortcutButton,
-                    this.state.isHighlighted && styles.emojiItemHighlighted,
-                ])}
+            <Tooltip
+                text={this.props.translate(`emojiPicker.headers.${this.props.code}`)}
+                shiftVertical={-4}
             >
-                <Tooltip
-                    containerStyles={[styles.flex1, styles.alignSelfStretch, styles.alignItemsCenter, styles.justifyContentCenter]}
-                    text={this.props.translate(`emojiPicker.headers.${this.props.code}`)}
-                    shiftVertical={-4}
+                <Pressable
+                    onPress={this.props.onPress}
+                    onHoverIn={() => this.setState({isHighlighted: true})}
+                    onHoverOut={() => this.setState({isHighlighted: false})}
+                    style={({pressed}) => ([
+                        StyleUtils.getButtonBackgroundColorStyle(getButtonState(false, pressed)),
+                        styles.categoryShortcutButton,
+                        this.state.isHighlighted && styles.emojiItemHighlighted,
+                    ])}
                 >
                     <Icon
                         fill={themeColors.icon}
@@ -54,8 +53,8 @@ class CategoryShortcutButton extends PureComponent {
                         height={variables.iconSizeNormal}
                         width={variables.iconSizeNormal}
                     />
-                </Tooltip>
-            </Pressable>
+                </Pressable>
+            </Tooltip>
         );
     }
 }
diff --git a/src/components/FloatingActionButton.js b/src/components/FloatingActionButton.js
index 2bc1d96d05ec..13275e5116a3 100644
--- a/src/components/FloatingActionButton.js
+++ b/src/components/FloatingActionButton.js
@@ -73,7 +73,7 @@ class FloatingActionButton extends PureComponent {
         });
 
         return (
-            <Tooltip absolute text={this.props.translate('common.new')}>
+            <Tooltip text={this.props.translate('common.new')}>
                 <View style={styles.floatingActionButtonContainer}>
                     <AnimatedPressable
                         ref={el => this.fabPressable = el}
diff --git a/src/components/Hoverable/index.js b/src/components/Hoverable/index.js
index 2f10cca0c1e3..2f275dd968fe 100644
--- a/src/components/Hoverable/index.js
+++ b/src/components/Hoverable/index.js
@@ -55,68 +55,55 @@ class Hoverable extends Component {
     }
 
     render() {
-        if (this.props.absolute && React.isValidElement(this.props.children)) {
-            return React.cloneElement(React.Children.only(this.props.children), {
-                ref: (el) => {
-                    this.wrapperView = el;
-
-                    // Call the original ref, if any
-                    const {ref} = this.props.children;
-                    if (_.isFunction(ref)) {
-                        ref(el);
-                    }
-                },
-                onMouseEnter: (el) => {
-                    this.setIsHovered(true);
-
-                    // Call the original onMouseEnter, if any
-                    const {onMouseEnter} = this.props.children;
-                    if (_.isFunction(onMouseEnter)) {
-                        onMouseEnter(el);
-                    }
-                },
-                onMouseLeave: (el) => {
-                    this.setIsHovered(false);
+        const child = _.isFunction(this.props.children)
+            ? this.props.children(this.state.isHovered)
+            : this.props.children
 
-                    // Call the original onMouseLeave, if any
-                    const {onMouseLeave} = this.props.children;
-                    if (_.isFunction(onMouseLeave)) {
-                        onMouseLeave(el);
-                    }
-                },
-                onBlur: (el) => {
-                    if (!this.wrapperView.contains(el.relatedTarget)) {
-                        this.setIsHovered(false);
-                    }
-
-                    // Call the original onBlur, if any
-                    const {onBlur} = this.props.children;
-                    if (_.isFunction(onBlur)) {
-                        onBlur(el);
-                    }
-                },
-            });
+        if (!React.isValidElement(child)) {
+            throw Error("Children is not a valid element.");
         }
-        return (
-            <View
-                style={this.props.containerStyles}
-                ref={el => this.wrapperView = el}
-                onMouseEnter={() => this.setIsHovered(true)}
-                onMouseLeave={() => this.setIsHovered(false)}
-                onBlur={(el) => {
-                    if (this.wrapperView.contains(el.relatedTarget)) {
-                        return;
-                    }
+
+        return React.cloneElement(React.Children.only(child), {
+            ref: (el) => {
+                this.wrapperView = el;
+
+                // Call the original ref, if any
+                const {ref} = child;
+                if (_.isFunction(ref)) {
+                    ref(el);
+                }
+            },
+            onMouseEnter: (el) => {
+                console.log("ENTER")
+                this.setIsHovered(true);
+
+                // Call the original onMouseEnter, if any
+                const {onMouseEnter} = child;
+                if (_.isFunction(onMouseEnter)) {
+                    onMouseEnter(el);
+                }
+            },
+            onMouseLeave: (el) => {
+                this.setIsHovered(false);
+
+                // Call the original onMouseLeave, if any
+                const {onMouseLeave} = child;
+                if (_.isFunction(onMouseLeave)) {
+                    onMouseLeave(el);
+                }
+            },
+            onBlur: (el) => {
+                if (!this.wrapperView.contains(el.relatedTarget)) {
                     this.setIsHovered(false);
-                }}
-            >
-                { // If this.props.children is a function, call it to provide the hover state to the children.
-                    _.isFunction(this.props.children)
-                        ? this.props.children(this.state.isHovered)
-                        : this.props.children
                 }
-            </View>
-        );
+
+                // Call the original onBlur, if any
+                const {onBlur} = child;
+                if (_.isFunction(onBlur)) {
+                    onBlur(el);
+                }
+            },
+        });
     }
 }
 
diff --git a/src/components/MultipleAvatars.js b/src/components/MultipleAvatars.js
index 6e30a2579a25..9a5099483fcc 100644
--- a/src/components/MultipleAvatars.js
+++ b/src/components/MultipleAvatars.js
@@ -69,8 +69,8 @@ const MultipleAvatars = (props) => {
 
     if (props.icons.length === 1 && !props.shouldStackHorizontally) {
         return (
-            <View style={avatarContainerStyles}>
-                <Tooltip text={props.avatarTooltips[0]}>
+            <Tooltip text={props.avatarTooltips[0]}>
+                <View style={avatarContainerStyles}>
                     <Avatar
                         source={props.icons[0].source}
                         size={props.size}
@@ -78,8 +78,8 @@ const MultipleAvatars = (props) => {
                         name={props.icons[0].name}
                         type={props.icons[0].type}
                     />
-                </Tooltip>
-            </View>
+                </View>
+            </Tooltip>
         );
     }
 
@@ -127,7 +127,7 @@ const MultipleAvatars = (props) => {
                 <View
                     style={singleAvatarStyles}
                 >
-                    <Tooltip text={props.avatarTooltips[0]} absolute>
+                    <Tooltip text={props.avatarTooltips[0]}>
                         {/* View is necessary for tooltip to show for multiple avatars in LHN */}
                         <View>
                             <Avatar
@@ -145,7 +145,7 @@ const MultipleAvatars = (props) => {
                         style={secondAvatarStyles}
                     >
                         {props.icons.length === 2 ? (
-                            <Tooltip text={props.avatarTooltips[1]} absolute>
+                            <Tooltip text={props.avatarTooltips[1]}>
                                 <View>
                                     <Avatar
                                         source={props.icons[1].source || props.fallbackIcon}
@@ -159,7 +159,7 @@ const MultipleAvatars = (props) => {
                                 </View>
                             </Tooltip>
                         ) : (
-                            <Tooltip text={props.avatarTooltips.slice(1).join(', ')} absolute>
+                            <Tooltip text={props.avatarTooltips.slice(1).join(', ')}>
                                 <View
                                     style={[singleAvatarStyles, styles.alignItemsCenter, styles.justifyContentCenter]}
                                 >
diff --git a/src/components/OptionRow.js b/src/components/OptionRow.js
index 532ae783bdd6..1bf7219df9d2 100644
--- a/src/components/OptionRow.js
+++ b/src/components/OptionRow.js
@@ -149,11 +149,7 @@ class OptionRow extends Component {
                 errors={this.props.option.allReportErrors}
                 shouldShowErrorMessages={false}
             >
-                <Hoverable
-                    containerStyles={[
-                        this.props.isDisabled ? styles.userSelectNone : null,
-                    ]}
-                >
+                <Hoverable>
                     {hovered => (
                         <TouchableOpacity
                             ref={el => touchableRef = el}
diff --git a/src/components/Reactions/AddReactionBubble.js b/src/components/Reactions/AddReactionBubble.js
index 3b57771311ab..0eb40ecccdc7 100644
--- a/src/components/Reactions/AddReactionBubble.js
+++ b/src/components/Reactions/AddReactionBubble.js
@@ -79,7 +79,7 @@ const AddReactionBubble = (props) => {
     };
 
     return (
-        <Tooltip text={props.translate('reportActionContextMenu.addReactionTooltip')} focusable={false}>
+        <Tooltip text={props.translate('reportActionContextMenu.addReactionTooltip')}>
             <Pressable
                 ref={ref}
                 style={({
diff --git a/src/components/Reactions/QuickEmojiReactions/BaseQuickEmojiReactions.js b/src/components/Reactions/QuickEmojiReactions/BaseQuickEmojiReactions.js
index 6e561d4a5201..d149c8a47d1c 100644
--- a/src/components/Reactions/QuickEmojiReactions/BaseQuickEmojiReactions.js
+++ b/src/components/Reactions/QuickEmojiReactions/BaseQuickEmojiReactions.js
@@ -40,9 +40,7 @@ const propTypes = {
 const BaseQuickEmojiReactions = props => (
     <View style={styles.quickReactionsContainer}>
         {_.map(CONST.QUICK_REACTIONS, emoji => (
-
-            // Note: focus is handled by the Pressable component in EmojiReactionBubble
-            <Tooltip text={`:${emoji.name}:`} key={emoji.name} focusable={false}>
+            <Tooltip text={`:${emoji.name}:`} key={emoji.name}>
                 <EmojiReactionBubble
                     emojiName={emoji.name}
                     emojiCodes={[getPreferredEmojiCode(emoji, props.preferredSkinTone)]}
diff --git a/src/components/ReportWelcomeText.js b/src/components/ReportWelcomeText.js
index ebfce58f3b0a..9f9bf7a926a2 100644
--- a/src/components/ReportWelcomeText.js
+++ b/src/components/ReportWelcomeText.js
@@ -114,7 +114,7 @@ const ReportWelcomeText = (props) => {
                             displayName, pronouns, tooltip,
                         }, index) => (
                             <Text key={`${displayName}${pronouns}${index}`}>
-                                <Tooltip text={tooltip} containerStyles={[styles.dInline]}>
+                                <Tooltip text={tooltip}>
                                     <Text style={[styles.textStrong]} onPress={() => Navigation.navigate(ROUTES.getDetailsRoute(participants[index]))}>
                                         {displayName}
                                     </Text>
diff --git a/src/components/SubscriptAvatar.js b/src/components/SubscriptAvatar.js
index 6da3e918fec4..44b3eb723671 100644
--- a/src/components/SubscriptAvatar.js
+++ b/src/components/SubscriptAvatar.js
@@ -42,20 +42,22 @@ const defaultProps = {
 const SubscriptAvatar = props => (
     <View style={props.size === CONST.AVATAR_SIZE.SMALL ? styles.emptyAvatarSmall : styles.emptyAvatar}>
         <Tooltip text={props.mainTooltip}>
-            <Avatar
-                source={props.mainAvatar.source}
-                size={props.size === CONST.AVATAR_SIZE.SMALL ? CONST.AVATAR_SIZE.SMALL : CONST.AVATAR_SIZE.DEFAULT}
-                name={props.mainAvatar.name}
-                type={props.mainAvatar.type}
-            />
+            <View>
+                <Avatar
+                    source={props.mainAvatar.source}
+                    size={props.size === CONST.AVATAR_SIZE.SMALL ? CONST.AVATAR_SIZE.SMALL : CONST.AVATAR_SIZE.DEFAULT}
+                    name={props.mainAvatar.name}
+                    type={props.mainAvatar.type}
+                />
+            </View>
         </Tooltip>
-        <View style={[
-            props.size === CONST.AVATAR_SIZE.SMALL ? styles.secondAvatarSubscriptCompact : styles.secondAvatarSubscript,
-            StyleUtils.getBackgroundAndBorderStyle(props.backgroundColor),
-            StyleUtils.getAvatarBorderStyle(props.size, props.secondaryAvatar.type),
-        ]}
-        >
-            <Tooltip text={props.secondaryTooltip}>
+        <Tooltip text={props.secondaryTooltip}>
+            <View style={[
+                props.size === CONST.AVATAR_SIZE.SMALL ? styles.secondAvatarSubscriptCompact : styles.secondAvatarSubscript,
+                StyleUtils.getBackgroundAndBorderStyle(props.backgroundColor),
+                StyleUtils.getAvatarBorderStyle(props.size, props.secondaryAvatar.type),
+            ]}
+            >
                 <Avatar
                     source={props.secondaryAvatar.source}
                     size={props.size === CONST.AVATAR_SIZE.SMALL ? CONST.AVATAR_SIZE.SMALL_SUBSCRIPT : CONST.AVATAR_SIZE.SUBSCRIPT}
@@ -63,8 +65,8 @@ const SubscriptAvatar = props => (
                     name={props.secondaryAvatar.name}
                     type={props.secondaryAvatar.type}
                 />
-            </Tooltip>
-        </View>
+            </View>
+        </Tooltip>
     </View>
 );
 
diff --git a/src/components/Tooltip/index.js b/src/components/Tooltip/index.js
index 104098b375f0..cb4c8b676759 100644
--- a/src/components/Tooltip/index.js
+++ b/src/components/Tooltip/index.js
@@ -1,6 +1,6 @@
 import _ from 'underscore';
 import React, {PureComponent} from 'react';
-import {Animated, View} from 'react-native';
+import {Animated} from 'react-native';
 import TooltipRenderedOnPageBody from './TooltipRenderedOnPageBody';
 import Hoverable from '../Hoverable';
 import withWindowDimensions from '../withWindowDimensions';
@@ -37,6 +37,7 @@ class Tooltip extends PureComponent {
         this.getWrapperPosition = this.getWrapperPosition.bind(this);
         this.showTooltip = this.showTooltip.bind(this);
         this.hideTooltip = this.hideTooltip.bind(this);
+        this.isFocusable = this.isFocusable.bind(this);
     }
 
     componentDidUpdate(prevProps) {
@@ -141,47 +142,50 @@ class Tooltip extends PureComponent {
         TooltipSense.deactivate();
     }
 
+    /**
+     * Returns true if children is a focusable component.
+     *
+     * @returns {Boolean}
+     */
+    isFocusable() {
+        const name = this.props.children.type.displayName;
+        const isPressableText = name === 'Text' && Boolean(this.props.children.props.onPress);
+        return isPressableText || ['TouchableOpacity', 'Pressable', 'TouchableWithoutFeedback'].includes(name);
+    }
+
     render() {
         // Skip the tooltip and return the children if the text is empty,
         // we don't have a render function or the device does not support hovering
         if ((_.isEmpty(this.props.text) && this.props.renderTooltipContent == null) || !this.hasHoverSupport) {
             return this.props.children;
         }
-        let child = (
-            <View
-                ref={el => this.wrapperView = el}
-                onBlur={this.hideTooltip}
-                focusable={this.props.focusable}
-                style={this.props.containerStyles}
-            >
-                {this.props.children}
-            </View>
-        );
-
-        if (this.props.absolute && React.isValidElement(this.props.children)) {
-            child = React.cloneElement(React.Children.only(this.props.children), {
-                ref: (el) => {
-                    this.wrapperView = el;
 
-                    // Call the original ref, if any
-                    const {ref} = this.props.children;
-                    if (_.isFunction(ref)) {
-                        ref(el);
-                    }
-                },
-                onBlur: (el) => {
-                    this.hideTooltip();
-
-                    // Call the original onBlur, if any
-                    const {onBlur} = this.props.children;
-                    if (_.isFunction(onBlur)) {
-                        onBlur(el);
-                    }
-                },
-                focusable: true,
-            });
+        if (!React.isValidElement(this.props.children)) {
+            throw Error("Children is not a valid element.");
         }
 
+        const child = React.cloneElement(React.Children.only(this.props.children), {
+            ref: (el) => {
+                this.wrapperView = el;
+
+                // Call the original ref, if any
+                const {ref} = this.props.children;
+                if (_.isFunction(ref)) {
+                    ref(el);
+                }
+            },
+            onBlur: (el) => {
+                this.hideTooltip();
+
+                // Call the original onBlur, if any
+                const {onBlur} = this.props.children;
+                if (_.isFunction(onBlur)) {
+                    onBlur(el);
+                }
+            },
+            focusable: this.isFocusable(),
+        });
+
         return (
             <>
                 {this.state.isRendered && (
@@ -201,8 +205,6 @@ class Tooltip extends PureComponent {
                     />
                 )}
                 <Hoverable
-                    absolute={this.props.absolute}
-                    containerStyles={this.props.containerStyles}
                     onHoverIn={this.showTooltip}
                     onHoverOut={this.hideTooltip}
                 >
diff --git a/src/pages/home/report/ReportActionItemSingle.js b/src/pages/home/report/ReportActionItemSingle.js
index 19d2cc05f58c..d6f5207e5a91 100644
--- a/src/pages/home/report/ReportActionItemSingle.js
+++ b/src/pages/home/report/ReportActionItemSingle.js
@@ -70,13 +70,13 @@ const ReportActionItemSingle = (props) => {
 
     return (
         <View style={props.wrapperStyles}>
-            <Pressable
-                style={[styles.alignSelfStart, styles.mr3]}
-                onPressIn={ControlSelection.block}
-                onPressOut={ControlSelection.unblock}
-                onPress={() => showUserDetails(actorEmail)}
-            >
-                <Tooltip text={actorEmail}>
+            <Tooltip text={actorEmail}>
+                <Pressable
+                    style={[styles.alignSelfStart, styles.mr3]}
+                    onPressIn={ControlSelection.block}
+                    onPressOut={ControlSelection.unblock}
+                    onPress={() => showUserDetails(actorEmail)}
+                >
                     <OfflineWithFeedback
                         pendingAction={lodashGet(pendingFields, 'avatar', null)}
                     >
@@ -85,8 +85,8 @@ const ReportActionItemSingle = (props) => {
                             source={avatarSource}
                         />
                     </OfflineWithFeedback>
-                </Tooltip>
-            </Pressable>
+                </Pressable>
+            </Tooltip>
             <View style={[styles.chatItemRight]}>
                 {props.showHeader ? (
                     <View style={[styles.chatItemMessageHeader]}>
diff --git a/src/pages/settings/InitialSettingsPage.js b/src/pages/settings/InitialSettingsPage.js
index 6d6db5a498f3..16cae58efe31 100755
--- a/src/pages/settings/InitialSettingsPage.js
+++ b/src/pages/settings/InitialSettingsPage.js
@@ -258,8 +258,8 @@ class InitialSettingsPage extends React.Component {
                         <ScrollView contentContainerStyle={safeAreaPaddingBottomStyle} style={[styles.settingsPageBackground]}>
                             <View style={styles.w100}>
                                 <View style={styles.avatarSectionWrapper}>
-                                    <Pressable style={[styles.mb3]} onPress={this.openProfileSettings}>
-                                        <Tooltip text={this.props.translate('common.profile')}>
+                                    <Tooltip text={this.props.translate('common.profile')}>
+                                        <Pressable style={[styles.mb3]} onPress={this.openProfileSettings}>
                                             <OfflineWithFeedback
                                                 pendingAction={lodashGet(this.props.currentUserPersonalDetails, 'pendingFields.avatar', null)}
                                             >
@@ -269,9 +269,8 @@ class InitialSettingsPage extends React.Component {
                                                     size={CONST.AVATAR_SIZE.LARGE}
                                                 />
                                             </OfflineWithFeedback>
-                                        </Tooltip>
-                                    </Pressable>
-
+                                        </Pressable>
+                                    </Tooltip>
                                     <Pressable style={[styles.mt1, styles.mw100]} onPress={this.openProfileSettings}>
                                         <Tooltip text={this.props.translate('common.profile')}>
                                             <Text style={[styles.textHeadline]} numberOfLines={1}>
diff --git a/src/pages/signin/SignInPageLayout/Footer.js b/src/pages/signin/SignInPageLayout/Footer.js
index 0f6e099bc8c0..2b0f9cd7cf60 100644
--- a/src/pages/signin/SignInPageLayout/Footer.js
+++ b/src/pages/signin/SignInPageLayout/Footer.js
@@ -162,12 +162,15 @@ const Footer = (props) => {
                                             key={row.translationPath}
                                         >
                                             {hovered => (
-                                                <TextLink
-                                                    style={[styles.footerRow, hovered ? styles.textBlue : {}]}
-                                                    href={row.link}
-                                                >
-                                                    {props.translate(row.translationPath)}
-                                                </TextLink>
+                                                <View>
+                                                    <TextLink
+                                                        style={[styles.footerRow, hovered ? styles.textBlue : {}]}
+                                                        href={row.link}
+                                                    >
+                                                        {console.log(hovered)}
+                                                        {props.translate(row.translationPath)}
+                                                    </TextLink>
+                                                </View>
                                             )}
                                         </Hoverable>
                                     ))}
diff --git a/src/pages/workspace/WorkspaceInitialPage.js b/src/pages/workspace/WorkspaceInitialPage.js
index fea68a5af262..f4c071457e11 100644
--- a/src/pages/workspace/WorkspaceInitialPage.js
+++ b/src/pages/workspace/WorkspaceInitialPage.js
@@ -187,12 +187,12 @@ class WorkspaceInitialPage extends React.Component {
                                 <View style={[styles.flex1]}>
                                     <View style={styles.avatarSectionWrapper}>
                                         <View style={[styles.settingsPageBody, styles.alignItemsCenter]}>
-                                            <Pressable
-                                                disabled={this.hasPolicyCreationError()}
-                                                style={[styles.pRelative, styles.avatarLarge]}
-                                                onPress={this.openEditor}
-                                            >
-                                                <Tooltip text={this.props.translate('workspace.common.settings')}>
+                                            <Tooltip text={this.props.translate('workspace.common.settings')}>
+                                                <Pressable
+                                                    disabled={this.hasPolicyCreationError()}
+                                                    style={[styles.pRelative, styles.avatarLarge]}
+                                                    onPress={this.openEditor}
+                                                >
                                                     <Avatar
                                                         containerStyles={styles.avatarLarge}
                                                         imageStyles={[styles.avatarLarge, styles.alignSelfCenter]}
@@ -202,8 +202,8 @@ class WorkspaceInitialPage extends React.Component {
                                                         name={policyName}
                                                         type={CONST.ICON_TYPE_WORKSPACE}
                                                     />
-                                                </Tooltip>
-                                            </Pressable>
+                                                </Pressable>
+                                            </Tooltip>
                                             {!_.isEmpty(this.props.policy.name) && (
                                                 <Pressable
                                                     disabled={this.hasPolicyCreationError()}
diff --git a/src/stories/Tooltip.stories.js b/src/stories/Tooltip.stories.js
index bb865bf242c7..a9c83963b476 100644
--- a/src/stories/Tooltip.stories.js
+++ b/src/stories/Tooltip.stories.js
@@ -41,7 +41,6 @@ Default.args = {
     text: 'Tooltip',
     numberOfLines: 1,
     maxWidth: 0,
-    absolute: false,
 };
 
 const RenderContent = () => {