I'm trying to create an inline form and want horizontal alignment between my fields. However, without any styling the SelectField is too high:
I've tried setting the margin and padding on the field, but not luck. How do I get them aligned?
Here is the jsx i'm using
<div style={containerStyle}>
<AutoComplete
floatingLabelText = "Origin"
dataSource = {["London", "Seattle", "Bombay"]}
style={{
marginLeft: 10,
martginRight: 10
}}/>
<AutoComplete
floatingLabelText = "Destination"
dataSource = {["London", "Seattle", "Bombay"]}
style={{
marginLeft: 10,
martginRight: 10
}}/>
<SelectField
style={{
marginLeft: 10,
martginRight: 10
}}
floatingLabelText = "Service"
value={this.state.selectValue}
onChange={this._handleSelectValueChange.bind(null, 'selectValue')}
valueMember="id"
displayMember="name"
menuItems={[
{id:"1", name:"Regular"},
{id:"2", name:"Express"}]} />
</div>
I'm trying to create an inline form and want horizontal alignment between my fields. However, without any styling the SelectField is too high:
I've tried setting the margin and padding on the field, but not luck. How do I get them aligned?
Here is the jsx i'm using