React Native - TouchableOpacity not working inside an absolute positioned View : <p>I've got an absolute positioned View that holds 3 TouchableOpacity components and the 3 fail to respond they are just not working at all, what is going wrong here please help me :)</p>

<p><strong>Code</strong></p>

<pre><code>&lt;View style={[styles.highNormalLowDocListHeaderStateContainer, {width: this.windowWidth, height: this.headerSmallHeight, position: 'absolute', left: 0, top: floatedHeaderTitleTop, elevation: 2}]}&gt;
    &lt;TouchableOpacity onPress={() =&gt; this.getDocuments('high')} style={[styles.highNormalLowDocListHeaderStateTextContainer, highSelected.borderStyle]}&gt;
        &lt;Text style={[styles.highNormalLowDocListHeaderStateText, highSelected.textStyle]}&gt;HIGH&lt;/Text&gt;
    &lt;/TouchableOpacity&gt;
    &lt;TouchableOpacity onPress={() =&gt; this.getDocuments('normal')} style={[styles.highNormalLowDocListHeaderStateTextContainer, normalSelected.borderStyle]}&gt;
        &lt;Text style={[styles.highNormalLowDocListHeaderStateText, normalSelected.textStyle]}&gt;NORMAL&lt;/Text&gt;
    &lt;/TouchableOpacity&gt;
    &lt;TouchableOpacity onPress={() =&gt; this.getDocuments('low')} style={[styles.highNormalLowDocListHeaderStateTextContainer, lowSelected.borderStyle]}&gt;
        &lt;Text style {[styles.highNormalLowDocListHeaderStateText, lowSelected.textStyle]}&gt;LOW&lt;/Text&gt;
    &lt;/TouchableOpacity&gt;
&lt;/View&gt;
</code></pre>

<p><strong>Screenshot</strong></p>

<p><a href="https://i.stack.imgur.com/kLCUU.png" rel="noreferrer"><img src="https://i.stack.imgur.com/kLCUU.png" alt="enter image description here"></a></p>
