I'm new to coding and I'm working with ionic 2 at the moment doing some practice apps. The problem I'm having is that I'm showing a popOver at the press of a button and inside the header part i am trying to use an item-divider between the title and subtitle. Whenever i try to move the divider up to get it close to the title this happens:
Is there a way to remove that space of the divider or make it smaller so that it doesn't cover up the title and make it look like an underline??
EDIT: here is the code inside the .
popover.html
<ion-row>
<ion-title class="title">BRAND</ion-title>
</ion-row>
<ion-row>
<ion-col width-100 class="divider">
<ion-item-divider></ion-item-divider>
</ion-col>
</ion-row>
<ion-row>
<ion-item class="subTitle"no-lines>
<p>Select your part</p>
</ion-item>
</ion-row>
and popover.ts
.title{
text-align: center;
padding-top: 5px;
}
.divider{
margin-top: -15px;
}
.poPosition{
padding-top: 100px!important;
}
That's all im using at this moment.
I figured it out using element inspector in FireFox. i had to modify these values to resize the divider:
.item-inner{
min-height: 1px !important;
}
.label-md{
margin-bottom: 1px!important;
margin-top: 1px!important;
}
ion-item-divider{
margin-top: 0px;
min-height: 1px!important;
}