title: Absolute and Flexbox in React Native
body: <p>I would like to put a white bar which would take all of the width at the bottom of the screen. To do so I thought about using <code>absolute</code> positioning with the inherited <code>flexbox</code> parameters. </p>
  
  <p>With the following code it renders something like <a href="http://img11.hostingpics.net/pics/494574Capturedcran20150409164910.png" rel="noreferrer">this</a>. </p>
  
  <p>Here is my code :</p>
  
  <pre><code>var NavigationBar = React.createClass({
    render: function() {
      return(
      &lt;View style={navigationBarStyles.navigationBar}&gt;
        //Icon 1, Icon 2...
      &lt;/View&gt;
      );
    }
  });
  
  var Main = React.createClass({
    render: function() {
      return(
        &lt;View style={mainStyles.container}&gt;
            &lt;NavigationBar /&gt;
        &lt;/View&gt;
      );
    }
  });
  
  var mainStyles = StyleSheet.create({
    container: {
      flex: 1,
      backgroundColor: '#456783',
    }
  });
  
  var navigationBarStyles = StyleSheet.create({
    navigationBar: {
      backgroundColor: '#FFFFFF',
      height: 30,
      position: 'absolute', 
      flexDirection: 'row',
      bottom: 0,
      justifyContent: 'space-between'
    },
  });
  </code></pre>
  
  <p>I'm new to styling in CSS and not all the properties are available in React-Native. So any help is appreciated, thanks :)</p>