Search code examples
react-nativetextinputreact-native-textinput

React Native TextInput: placeholder and detx padding

I have a TextInput with rounded corners :

<TextInput
    style={{
        backgroundColor : '#FFFFFF',
        borderRadius : 30,
        marginLeft : 8,
        marginRight : 8,
        marginTop : 10
    }}
    placeholder = 'A placeholder'
/>

but i would like to give some left padding to placeholder (and text that will be contained inside TextInput), because now text is too near to left TextInput border. How can i do it?

Solution

  • Instead of marginLeft use paddingLeft 

    <TextInput
    style={{
          backgroundColor: '#ffffff',
          borderRadius: 30,
          paddingLeft: 8,
          paddingRight: 8,
          marginTop: 10
        }}
        placeholder='A placeholder'
      />

    I hope this will help