Input field underline missing when inside ion-card

[DennisSmolek]

**Ionic version: 3.2.1

**I'm submitting a Bug Report

Current behavior:
When I put an <ion-input> inside an <ion-card> The bottom border that acts as an underline is being overwritten with some core css found here
when using the md or default modes.

.card-md .item-md.item-block .item-inner {
  border: 0;
}

The password field has a border but only because it is also the last child of a list.

Code to produce:

<ion-card class="contentBox">
            <ion-card-header>
              <h3>Login</h3>
            </ion-card-header>
            <ion-card-content>
            <ion-list>
              <ion-item>
                <ion-label floating>Email</ion-label>
                <ion-input type="email"></ion-input>
              </ion-item>
              <ion-item>
                <ion-label floating>Password</ion-label>
                <ion-input type="password"></ion-input>
              </ion-item>
            </ion-list>
            </ion-card-content>
</ion-card> <!-- contentBox -->

Expected behavior:
Should leave the underline intact
Plunker: http://plnkr.co/edit/hSbLqd?p=preview

[jgw96]

Thanks, we will take a look into this.

[jeson114]

+1 ,got the same issue

[jeson114]

is this fixed ?

[DennisSmolek]

@jeson114 Not that I've seen

[iget-master]

Same issue here, @jgw96 the issue have almost 2 months with no fixes, looks a simple css adjustment!

[iget-master]

The issue can be fixed by updating the css that @DennisSmolek mentioned to this:

.card-md .item-md.item-block:not(.item-input):not(.item-select):not(.item-radio):not(.item-checkbox) .item-inner {
  border: 0;
}

I've never contributed to this project, so I could not found yet where is the scss that defines this rule.

[iget-master]

While ionic-team doesn't fix it, the following rules could be added to your app.scss to fix it:

//@todo: Remove after Issue ionic-team/ionic#11640 is fixed
.card-md .item-md.item-block:not(:last-child) .item-inner {
  border-bottom: 1px solid #dedede;
}

.card-md .item-md.item-block:not(.item-input):not(.item-select):not(.item-radio):not(.item-checkbox) .item-inner {
  border: 0;
}

[lsoaresesilva]

+1

[15steps]

+1, same issue here!

[airstep]

+1