CODEWITHSUNDEEP
reactjs
Rockers Raghu
Rockers Raghu

Reputation: 33

how to increase input text box size in react-autocomplete?

how to increase the size of input tag in react-autocomplete package? i didn't know how to change the input box size because there is no clear documentation regarding that? here is the link of react-autocomplete package

Example

<Autocomplete
  getItemValue={(item) => item.label}
  items={[
    { label: 'apple' },
    { label: 'banana' },
    { label: 'pear' }
  ]}
  renderItem={(item, isHighlighted) =>
    <div style={{ background: isHighlighted ? 'lightgray' : 'white' }}>
      {item.label}
    </div>
  }
  value={value}
  onChange={(e) => value = e.target.value}
  onSelect={(val) => value = val}
/>

this code automatically creates one input box of some size my question is how to resize the input box size?

Upvotes: 3

Views: 5136

Answers (1)

Robert Farley
Robert Farley

Reputation: 2456

Looks like you can use a combination of the following props to affect input style: inputProps, wrapperStyle. 

<Autocomplete
   {...props}
   inputProps={{ style: { width: 100% } }}
   wrapperStyle={ width: 1000 }
/>

Upvotes: 3

Related Questions