Search code examples
javascriptreactjsreact-bootstrap

Input type=text Formatting Issue Bootstrap React Javascript


Formatting Issues

I am using validators for type=text and type=email. I am not sure why the email field is showing the underline for input but the text type is not. Ideas?

<form noValidate onSubmit={this.onSubmit}>
          <div className="input-field col s12">
            <input
              onChange={this.onChange}
              value={this.state.name}
              error={errors.name}
              id="name"
              type="text"
              className={classnames("", {
                invalid: errors.name
              })}
            />
            <label htmlFor="name">Name</label>
            <span className="red-text">{errors.name}</span>
          </div>
          <div className="input-field col s12">
            <input
              onChange={this.onChange}
              value={this.state.email}
              error={errors.email}
              id="email"
              type="email"
              className={classnames("", {
                invalid: errors.email
              })}
            />
            <label htmlFor="email">Email</label>
            <span className="red-text">{errors.email}</span>
          </div>

Solution

  • @domenikk Thanks for the interaction. Took another look at found this: input[type=text]:not(.browser-default){ border-bottom:none; margin:0; }