title: How to override parent styles in React Native
body: <p>I have A container class, and i put custom made components in it with respect to container's state. In below component i defined width as <code>width: '100%'</code> however, in container class i have a stylesheet variable where i give <code>paddingLeft: 20</code> <code>paddingRight: 20</code> in order to make stateless components more shaped.
  this is one my stateless component:</p>
  
  <pre><code>const Seperator = props =&gt; {
      stt = {
          backgroundColor: props.backgroundColor,
      }
      textstt = {
          color: props.backgroundColor == colors.BLACK
              ? colors.WHITE
              : colors.BLACK
      }
      console.log('I am in seperator, backgroundcolor: ', props.backgroundColor, 'text', props.text, 'textcolor: ', textstt);
      return (
          &lt;View style={[styles.container, stt]}&gt;
              &lt;Text style={[styles.text, textstt]}&gt;{props.text}&lt;/Text&gt;
          &lt;/View&gt;
      );
  };
  </code></pre>
  
  <p>this is how i used above component.</p>
  
  <pre><code>            &lt;NewAdHoc
                  contentText={'Kategori Secimi'}
                  onBackPress={this.handleBackPress}
                  showContentText={false}
              &gt;
                  &lt;View style={styles.container}&gt;
                      {currentCategory !== null
                          ? &lt;View style={styles.flatListContainer}&gt;
                              &lt;ListViewItem
                                  categoryName={currentCategory.categoryName}
                                  iconName={currentCategory.categoryIcon}
                                  showBorder={false}
                                  key={currentCategory.categoryId}
                                  categoryId={currentCategory.categoryId}
                                  inNewAdScreen={false}
                              /&gt;
                              &lt;Seperator
                                  backgroundColor={colors.BLACK}
                                  text={'Ilan Turu'}
                              /&gt;
                              {
                                  currentCategory.subCategories.map((subc) =&gt; (
                                      &lt;SubCategoryItem
                                          text={subc.subCategoryName}
                                          key={subc.subCategoryId}
                                          showBorder={true}
                                      /&gt;
                                  ))
  
                              }
                          &lt;/View&gt;
                          : null
                      }
                  &lt;/View&gt;
              &lt;/NewAdHoc&gt;
  </code></pre>
  
  <p>but there is one thing i could not accomplish, i want my <code>&lt;Seperator/&gt;</code> not effected by <code>styles.flatListContainer</code>'s <code>paddingLeft</code> and <code>paddingRight</code> styles.</p>
  
  <p>Any help will be appreciated, thanks.</p>