title: How to write one piece of styling code that works for every phone dimension (react-native)
body: <p>The last app I made in react-native targeted for iOS. I made a folder called <code>Dimensions</code> which mapped every iPhone dimension to a javascript file that styled the entire app for that dimension. So I had to tediously size the app for every iPhone dimension. I've recently tried things people recommended such as,</p>
  <p><strong>Sizing based on height and width of screen</strong></p>
  <pre class="lang-js prettyprint-override"><code>import { Dimensions} from 'react-native';
  const {width,height} = Dimensions.get(&quot;screen&quot;);
  </code></pre>
  <p><strong>Doing position absolute</strong></p>
  <pre class="lang-js prettyprint-override"><code> &lt;View style={{position:&quot;absolute&quot;,top:0,bottom:10,}}&gt;
  
   &lt;/View&gt;
  </code></pre>
  <p><strong>Flex box, and some other things</strong>. However I was never able to use these tools to size my app in exactly one piece of code for every dimension.</p>
  <p><strong>Does anyone have a solid solution?</strong></p>